-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1219 from navikt/feature/select-boxes
Convert select boxes component to React
- Loading branch information
Showing
14 changed files
with
781 additions
and
83 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
66 changes: 66 additions & 0 deletions
66
mocks/mocks/data/innsending-api/select-boxes/mellomlagring-select-boxes.json
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,66 @@ | ||
{ | ||
"brukerId": "19876898104", | ||
"skjemanr": "select-boxes-test", | ||
"tittel": "Select boxes test", | ||
"tema": "AGR", | ||
"spraak": "nb", | ||
"hoveddokument": { | ||
"vedleggsnr": "select-boxes-test", | ||
"tittel": "Select boxes test", | ||
"label": "Select boxes test", | ||
"pakrevd": true, | ||
"mimetype": "application/pdf" | ||
}, | ||
"hoveddokumentVariant": { | ||
"vedleggsnr": "select-boxes-test", | ||
"tittel": "Select boxes test", | ||
"label": "Select boxes test", | ||
"pakrevd": false, | ||
"mimetype": "application/json", | ||
"document": { | ||
"language": "nb-NO", | ||
"data": { | ||
"data": { | ||
"selectBoxesWithDefaultValue": { | ||
"choice1": true, | ||
"choice2": true, | ||
"choice3": false | ||
}, | ||
"selectBoxesWithDescription": { | ||
"choice1": true, | ||
"choice2": false, | ||
"choice3": false, | ||
"choice4": false, | ||
"choice5": false | ||
}, | ||
"selectBoxes": { | ||
"choice1": true, | ||
"choice2": false, | ||
"choice3": false | ||
} | ||
}, | ||
"metadata": { | ||
"timezone": "Europe/Oslo", | ||
"offset": 120, | ||
"origin": "http://localhost:3001", | ||
"referrer": "http://localhost:3001/fyllut/selectboxestest", | ||
"browserName": "Netscape", | ||
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36", | ||
"pathName": "/fyllut/selectboxestest/veiledning", | ||
"onLine": true | ||
}, | ||
"state": "submitted", | ||
"_vnote": "" | ||
} | ||
} | ||
}, | ||
"innsendingsId": "e5a341ee-810d-4138-9550-b96d5c307cb6", | ||
"status": "Opprettet", | ||
"vedleggsListe": [], | ||
"kanLasteOppAnnet": true, | ||
"fristForEttersendelse": 14, | ||
"endretDato": "2024-06-17T13:21:09.17675+02:00", | ||
"skalSlettesDato": "2024-07-15T11:21:09.166405Z", | ||
"skjemaPath": "selectboxestest", | ||
"visningsType": "fyllUt" | ||
} |
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
148 changes: 148 additions & 0 deletions
148
packages/fyllut/cypress/e2e/components/select-boxes.cy.ts
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,148 @@ | ||
/* | ||
* Tests that the select boxes component (react) renders and functions correctly | ||
*/ | ||
|
||
import { TEXTS } from '@navikt/skjemadigitalisering-shared-domain'; | ||
import { expect } from 'chai'; | ||
|
||
describe('Select boxes', () => { | ||
before(() => { | ||
cy.configMocksServer(); | ||
}); | ||
|
||
after(() => { | ||
cy.mocksRestoreRouteVariants(); | ||
}); | ||
|
||
describe('Paper', () => { | ||
beforeEach(() => { | ||
cy.defaultIntercepts(); | ||
cy.visit('/fyllut/selectboxestest/selectBoxes?sub=paper'); | ||
cy.defaultWaits(); | ||
}); | ||
|
||
it('should check 2 select boxes and show correct values in summary', () => { | ||
cy.findByRole('group', { name: 'Select boxes' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 1' }).check(); | ||
}); | ||
|
||
cy.findByRole('group', { name: 'Select boxes with description' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 2 Description 2' }).check(); | ||
}); | ||
|
||
cy.clickNextStep(); | ||
|
||
cy.findByRole('radio', { name: 'Jeg legger det ved dette skjemaet' }).check(); | ||
|
||
cy.clickNextStep(); | ||
|
||
// Summary | ||
cy.get('dl') | ||
.first() | ||
.within(() => { | ||
// Select boxes | ||
cy.get('li').eq(0).should('contain.text', 'Choice 1'); | ||
|
||
// Select boxes with defaultValue | ||
cy.get('li').eq(1).should('contain.text', 'Choice 1'); | ||
cy.get('li').eq(2).should('contain.text', 'Choice 2'); | ||
|
||
// Select boxes with description | ||
cy.get('li').eq(3).should('contain.text', 'Choice 2'); | ||
}); | ||
}); | ||
|
||
it('should show error for required select boxes', () => { | ||
cy.clickNextStep(); | ||
|
||
// Error summary | ||
cy.findByRole('region', { name: TEXTS.validering.error }) | ||
.should('exist') | ||
.within(() => { | ||
cy.findByRole('link', { name: 'Du må fylle ut: Select boxes' }).should('exist'); | ||
}); | ||
|
||
// Component error | ||
cy.findAllByText('Du må fylle ut: Select boxes').should('have.length', 2); | ||
}); | ||
|
||
it('should show description', () => { | ||
cy.findByText('Normal description').should('exist'); | ||
cy.findByRole('button', { name: 'Extended description' }).should('exist'); | ||
cy.findByRole('button', { name: 'Extended description' }).click(); | ||
cy.findByText('Extended description text').should('exist'); | ||
}); | ||
}); | ||
|
||
describe('Digital', () => { | ||
it('should have correct submission values', () => { | ||
cy.defaultIntercepts(); | ||
cy.visit('/fyllut/selectboxestest/selectBoxes?sub=digital'); | ||
cy.defaultWaits(); | ||
|
||
cy.findByRole('group', { name: 'Select boxes' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 3' }).check(); | ||
}); | ||
|
||
cy.findByRole('group', { name: 'Select boxes with description' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 4 Description 4' }).check(); | ||
}); | ||
|
||
cy.clickSaveAndContinue(); | ||
|
||
cy.submitMellomlagring((req) => { | ||
const { | ||
submission: { data }, | ||
} = req.body; | ||
|
||
// Select boxes | ||
expect(data.selectBoxes.choice1).to.equal(false); | ||
expect(data.selectBoxes.choice2).to.equal(false); | ||
expect(data.selectBoxes.choice3).to.equal(true); | ||
|
||
// Select boxes with defaultValue | ||
expect(data.selectBoxesWithDefaultValue.choice1).to.equal(true); | ||
expect(data.selectBoxesWithDefaultValue.choice2).to.equal(true); | ||
expect(data.selectBoxesWithDefaultValue.choice3).to.equal(false); | ||
|
||
// Select boxes with description | ||
expect(data.selectBoxesWithDescription.choice1).to.equal(false); | ||
expect(data.selectBoxesWithDescription.choice2).to.equal(false); | ||
expect(data.selectBoxesWithDescription.choice3).to.equal(false); | ||
expect(data.selectBoxesWithDescription.choice4).to.equal(true); | ||
expect(data.selectBoxesWithDescription.choice5).to.equal(false); | ||
}); | ||
|
||
cy.clickSaveAndContinue(); | ||
cy.wait('@submitMellomlagring'); | ||
}); | ||
|
||
it('should load mellomlagring', () => { | ||
cy.mocksUseRouteVariant('get-soknad:success-select-boxes'); | ||
|
||
cy.defaultIntercepts(); | ||
cy.visit('/fyllut/selectboxestest/selectBoxes?sub=digital&innsendingsId=e5a341ee-810d-4138-9550-b96d5c307cb6'); | ||
cy.defaultWaits(); | ||
|
||
cy.findByRole('group', { name: 'Select boxes' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 1' }).should('be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 2' }).should('not.be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 3' }).should('not.be.checked'); | ||
}); | ||
|
||
cy.findByRole('group', { name: 'Select boxes with defaultValue' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 1' }).should('be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 2' }).should('be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 3' }).should('not.be.checked'); | ||
}); | ||
|
||
cy.findByRole('group', { name: 'Select boxes with description' }).within(() => { | ||
cy.findByRole('checkbox', { name: 'Choice 1 Description 1' }).should('be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 2 Description 2' }).should('not.be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 3 Description 3' }).should('not.be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 4 Description 4' }).should('not.be.checked'); | ||
cy.findByRole('checkbox', { name: 'Choice 5' }).should('not.be.checked'); | ||
}); | ||
}); | ||
}); | ||
}); |
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
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
75 changes: 0 additions & 75 deletions
75
packages/shared-components/src/formio/components/core/select-boxes/SelectBoxes.ts
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.