[O2B-1056] bookkeeping error page #1820
+218
−20
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,53 @@ | ||
| /** | ||
| * @license | ||
| * Copyright CERN and copyright holders of ALICE O2. This software is | ||
| * distributed under the terms of the GNU General Public License v3 (GPL | ||
| * Version 3), copied verbatim in the file "COPYING". | ||
| * | ||
| * See http://alice-o2.web.cern.ch/license for full licensing information. | ||
| * | ||
| * In applying this license CERN does not waive the privileges and immunities | ||
| * granted to it by virtue of its status as an Intergovernmental Organization | ||
| * or submit itself to any jurisdiction. | ||
| */ | ||
|
|
||
| import { Observable } from '/js/src/index.js'; | ||
|
|
||
| /** | ||
| * Model representing handlers for errorPage.js | ||
| */ | ||
| export class ErrorModel extends Observable { | ||
| /** | ||
| * The constructor for the Error model object | ||
| * @returns {Object} Constructs the Error model | ||
| */ | ||
| constructor() { | ||
| super(); | ||
| this.error = { | ||
| code: 'Unknown Error', | ||
| codeDescription: 'Something unexpected happened.', | ||
| message: 'Please try again later.', | ||
| }; | ||
| } | ||
|
|
||
| /** | ||
| * Sets the error object for the model | ||
| * @param {Object} error The error object to set, must contain a code, codeDescription and message | ||
|
There was a problem hiding this comment. Please use a precise object description instead of simply suggesting it in comment. Because you use it in different places, I suppose you should create a typedef. |
||
| * @returns {void} | ||
| */ | ||
| setError(error) { | ||
| if (!error.code || !error.codeDescription || !error.message) { | ||
| return; | ||
| } | ||
| this.error = error; | ||
| this.notify(); | ||
| } | ||
|
|
||
| /** | ||
| * Returns the error object for the model | ||
| * @returns {Object} The error object | ||
| */ | ||
| getError() { | ||
| return this.error; | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| /** | ||
| * @license | ||
| * Copyright CERN and copyright holders of ALICE O2. This software is | ||
| * distributed under the terms of the GNU General Public License v3 (GPL | ||
| * Version 3), copied verbatim in the file "COPYING". | ||
| * | ||
| * See http://alice-o2.web.cern.ch/license for full licensing information. | ||
| * | ||
| * In applying this license CERN does not waive the privileges and immunities | ||
| * granted to it by virtue of its status as an Intergovernmental Organization | ||
| * or submit itself to any jurisdiction. | ||
| */ | ||
| import { h, iconHome } from '/js/src/index.js'; | ||
|
|
||
| /** | ||
| * Error page component that dynamically displays error details based on the model | ||
| * @param {Model} model - Represents the current application state | ||
| * @returns {Component} Error page component | ||
| */ | ||
| export const ErrorPage = (model) => { | ||
| const { code, codeDescription, message } = model.errorModel.error; | ||
| return h('div.flex-column.justify-center ', [ | ||
| h('.flex-column.items-center.g3.mv4', [ | ||
| h('img', { | ||
| src: 'assets/alice.png', | ||
| alt: 'Alice logo', | ||
| style: 'width: 200px', | ||
| }), | ||
| h('h2', 'Oops! Something went wrong.'), | ||
| h('h3', `${code} - ${codeDescription}`), | ||
| h('.f5', message), | ||
| h('button.btn.btn-primary', { | ||
| onclick: () => { | ||
| model.router.go('?page=home'); | ||
|
There was a problem hiding this comment. In my opinion, we should avoid as much as possible dependencies inside components. The ideal would be for it to depend only on a very specific submodel, in this case only on |
||
| } }, [ | ||
| iconHome(), | ||
| ' Go to Home Page', | ||
|
There was a problem hiding this comment. You should use flex container and flex-gap instead of putting a space in your text |
||
| ]), | ||
| ]), | ||
| ]); | ||
| }; | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,62 @@ | ||
| /** | ||
| * @license | ||
| * Copyright CERN and copyright holders of ALICE O2. This software is | ||
| * distributed under the terms of the GNU General Public License v3 (GPL | ||
| * Version 3), copied verbatim in the file "COPYING". | ||
| * | ||
| * See http://alice-o2.web.cern.ch/license for full licensing information. | ||
| * | ||
| * In applying this license CERN does not waive the privileges and immunities | ||
| * granted to it by virtue of its status as an Intergovernmental Organization | ||
| * or submit itself to any jurisdiction. | ||
| */ | ||
|
|
||
| const chai = require('chai'); | ||
| const { defaultBefore, defaultAfter, goToPage } = require('../defaults.js'); | ||
| const { resetDatabaseContent } = require('../../utilities/resetDatabaseContent.js'); | ||
|
|
||
| const { expect } = chai; | ||
|
|
||
| module.exports = () => { | ||
| let page; | ||
| let browser; | ||
|
|
||
| before(async () => { | ||
| [page, browser] = await defaultBefore(page, browser); | ||
| await page.setViewport({ | ||
| width: 700, | ||
| height: 720, | ||
| deviceScaleFactor: 1, | ||
| }); | ||
|
Comment on lines
+26
to
+30
There was a problem hiding this comment. Do you need to set this? |
||
| await resetDatabaseContent(); | ||
| }); | ||
|
|
||
| after(async () => { | ||
| [page, browser] = await defaultAfter(page, browser); | ||
| }); | ||
|
|
||
| it('loads the page successfully', async () => { | ||
| const response = await goToPage(page, 'error'); | ||
|
|
||
| // We expect the page to return the correct status code, making sure the server is running properly | ||
| expect(response.status()).to.equal(200); | ||
|
|
||
| // We expect the page to return the correct title, making sure there isn't another server running on this port | ||
| const title = await page.title(); | ||
| expect(title).to.equal('AliceO2 Bookkeeping'); | ||
| }); | ||
|
|
||
| it('shows the error message', async () => { | ||
| await goToPage(page, 'error'); | ||
|
There was a problem hiding this comment. You can consider that one suite of frontend test is a continuous test, basically you can make them dependent one of the other. In this test for example you can suppose that you are already in the right page, and simply do your tests. Same for the next ones, and this way we avoid navigation. |
||
|
|
||
| const errorTitle = await page.$eval('h2', (el) => el.innerText); | ||
| expect(errorTitle).to.equal('Oops! Something went wrong.'); | ||
| }); | ||
|
|
||
| it ('shows the default text', async () => { | ||
| await goToPage(page, 'error'); | ||
|
|
||
| const errorCode = await page.$eval('h3', (el) => el.innerText); | ||
| expect(errorCode).to.equal('Unknown Error - Something unexpected happened.'); | ||
| }); | ||
| }; | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,17 @@ | ||
| /** | ||
| * @license | ||
| * Copyright CERN and copyright holders of ALICE O2. This software is | ||
| * distributed under the terms of the GNU General Public License v3 (GPL | ||
| * Version 3), copied verbatim in the file "COPYING". | ||
| * | ||
| * See http://alice-o2.web.cern.ch/license for full licensing information. | ||
| * | ||
| * In applying this license CERN does not waive the privileges and immunities | ||
| * granted to it by virtue of its status as an Intergovernmental Organization | ||
| * or submit itself to any jurisdiction. | ||
| */ | ||
| const ErrorSuite = require('./error.test'); | ||
|
|
||
| module.exports = () => { | ||
| describe('Error Page', ErrorSuite); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You should try to avoid as much as possible this kind of huge changes, for example reordering imports. It adds a lot of noise for review, and someone might do the other way around in a future commit, and this is an endless cycle of changes.