Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor Address input component test file to new format #3316

Open
wants to merge 24 commits into
base: main
Choose a base branch
from
Open
Changes from 1 commit
Commits
Show all changes
24 commits
Select commit Hold shift + click to select a range
76fa362
refactor address input test
precious-onyenaucheya-ons Aug 23, 2024
70b5a3e
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 2, 2024
32606bf
move test examples to new file
precious-onyenaucheya-ons Sep 4, 2024
496bd95
update test
precious-onyenaucheya-ons Sep 5, 2024
2ed1b82
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 9, 2024
fc746bf
update for
precious-onyenaucheya-ons Sep 12, 2024
46d68fc
revert changes to js test file
precious-onyenaucheya-ons Sep 12, 2024
b3c757e
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 12, 2024
6768bd4
address Pr comments
precious-onyenaucheya-ons Sep 13, 2024
92c5f16
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 13, 2024
43aa23d
Update src/components/address-input/_macro.spec.js
precious-onyenaucheya-ons Sep 13, 2024
c47fa15
Update src/components/address-input/_macro.spec.js
precious-onyenaucheya-ons Sep 13, 2024
4b0a4de
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 13, 2024
1479ae3
update
precious-onyenaucheya-ons Sep 16, 2024
3e977aa
address PR comments
precious-onyenaucheya-ons Sep 16, 2024
1a3cf5d
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 17, 2024
89e8ed0
Merge branch 'main' into feature/132/refactor-address-input-test
alessioventuriniAND Sep 17, 2024
c9cf6ea
update
precious-onyenaucheya-ons Sep 17, 2024
cd40aa5
Update src/components/address-input/_macro.spec.js
precious-onyenaucheya-ons Sep 19, 2024
5fe61f1
Update src/components/address-input/_macro.spec.js
precious-onyenaucheya-ons Sep 19, 2024
d0c926e
Merge branch 'main' into feature/132/refactor-address-input-test
precious-onyenaucheya-ons Sep 20, 2024
c68cd42
rephrase test name
precious-onyenaucheya-ons Sep 23, 2024
5f6a1bb
Merge branch 'main' into feature/132/refactor-address-input-test
alessioventuriniAND Sep 25, 2024
7166e92
Merge branch 'main' into feature/132/refactor-address-input-test
rmccar Sep 27, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 22 additions & 22 deletions src/components/address-input/_macro.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@ describe('FOR: address-input', () => {
}),
);

test('THEN: does not have class to hide input fields', () => {
test('THEN: it does not have class to hide input fields', () => {
expect($('.ons-js-address-input__manual').hasClass('ons-u-db-no-js_enabled')).toBe(false);
});
});
Expand Down Expand Up @@ -138,12 +138,12 @@ describe('FOR: address-input', () => {
searchButton: 'Search for address',
}),
);
test('THEN: it does not render', () => {
test('THEN: search button does not render', () => {
expect($('.ons-js-address-search-btn').length).toBe(0);
});
});

describe('WHEN: there is no javascript', () => {
describe('WHEN: javascript has been disabled', () => {
precious-onyenaucheya-ons marked this conversation as resolved.
Show resolved Hide resolved
const $ = cheerio.load(
renderComponent('address-input', {
...EXAMPLE_AUTOSUGGEST_ADDRESS_MINIMAL,
Expand All @@ -152,24 +152,24 @@ describe('FOR: address-input', () => {
}),
);

test('THEN: it marks field so that it is displayed', () => {
test('THEN: search button is displayed', () => {
expect($('.ons-js-address-search-btn').hasClass('ons-u-db-no-js_disabled')).toBe(true);
});

test('THEN: it renders provided text for search button', () => {
test('THEN: it renders search button with provided text', () => {
expect($('.ons-js-address-search-btn').text().trim()).toBe('Search for address');
});
});
});

describe('GIVEN: hidden field for uprn', () => {
balibirchlee marked this conversation as resolved.
Show resolved Hide resolved
describe('WHEN: `uprn.value` is not provided', () => {
describe('WHEN: uprn.value is not provided', () => {
const faker = templateFaker();
const inputSpy = faker.spy('input', { suppressOutput: true });

faker.renderComponent('address-input', EXAMPLE_AUTOSUGGEST_ADDRESS_MINIMAL);

test('THEN: it renders hidden `input` component with expected parameters', () => {
test('THEN: it renders hidden input component with expected parameters', () => {
expect(inputSpy.occurrences).toContainEqual({
id: 'address-input-example-id-uprn',
classes: 'ons-js-hidden-uprn ons-u-d-no',
Expand All @@ -180,7 +180,7 @@ describe('FOR: address-input', () => {
});
});

describe('WHEN: `uprn.value` is provided', () => {
describe('WHEN: uprn.value is provided', () => {
const faker = templateFaker();
const inputSpy = faker.spy('input', { suppressOutput: true });

Expand All @@ -191,7 +191,7 @@ describe('FOR: address-input', () => {
},
});

test('THEN: it renders hidden `input` component with expected parameters', () => {
test('THEN: it renders hidden input component with expected parameters', () => {
expect(inputSpy.occurrences).toContainEqual({
id: 'address-input-example-id-uprn',
classes: 'ons-js-hidden-uprn ons-u-d-no',
Expand All @@ -204,7 +204,7 @@ describe('FOR: address-input', () => {
});

describe('GIVEN: autosuggest search field', () => {
balibirchlee marked this conversation as resolved.
Show resolved Hide resolved
describe('WHEN: `manualEntry` is `true`', () => {
describe('WHEN: manualEntry is true', () => {
balibirchlee marked this conversation as resolved.
Show resolved Hide resolved
const faker = templateFaker();
const autosuggestSpy = faker.spy('autosuggest', { suppressOutput: true });

Expand All @@ -213,18 +213,18 @@ describe('FOR: address-input', () => {
manualEntry: true,
});

test('THEN: it is not shown', () => {
test('THEN: autosuggest search field is not shown', () => {
expect(autosuggestSpy.occurrences.length).toBe(0);
});
});

describe('WHEN: `manualEntry` is not set', () => {
describe('WHEN: manualEntry is not set', () => {
const faker = templateFaker();
const autosuggestSpy = faker.spy('autosuggest', { suppressOutput: true });

// Since `autosuggestSpy` suppresses output the values being tested below do not
// Since autosuggestSpy suppresses output the values being tested below do not
// need to represent real values. This test is only interested in verifying that
// the provided values are being passed through to the `autosuggest` component.
// the provided values are being passed through to the autosuggest component.
faker.renderComponent('address-input', {
...EXAMPLE_AUTOSUGGEST_ADDRESS_MINIMAL,
label: {
Expand Down Expand Up @@ -269,7 +269,7 @@ describe('FOR: address-input', () => {
manualLinkText: '[params.manualLinkText]',
});

test('THEN: it renders `autosuggest` component with expected parameters', () => {
test('THEN: it renders autosuggest component with expected parameters', () => {
balibirchlee marked this conversation as resolved.
Show resolved Hide resolved
expect(autosuggestSpy.occurrences[0]).toEqual({
id: 'address-input-example-id-autosuggest',
classes: 'ons-address-input__autosuggest ons-u-mb-no',
Expand Down Expand Up @@ -321,7 +321,7 @@ describe('FOR: address-input', () => {
});
});

describe('WHEN: provided with a default value for `manualLink`', () => {
describe('WHEN: provided with a default value for manualLink', () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

manualLink should be a given with two whens underneath that cover default and supplied values

const $ = cheerio.load(
renderComponent('address-input', {
...EXAMPLE_AUTOSUGGEST_ADDRESS_MINIMAL,
Expand All @@ -335,7 +335,7 @@ describe('FOR: address-input', () => {
});
});

describe('WHEN: a value for `manualLink` is provided', () => {
describe('WHEN: a value for manualLink is provided', () => {
rmccar marked this conversation as resolved.
Show resolved Hide resolved
const $ = cheerio.load(
renderComponent('address-input', {
...EXAMPLE_AUTOSUGGEST_ADDRESS_MINIMAL,
Expand All @@ -344,15 +344,15 @@ describe('FOR: address-input', () => {
}),
);

test('THEN: renders `manualLinkText` with `manualLink`', () => {
test('THEN: it renders the provided manualLink with the manualText', () => {
precious-onyenaucheya-ons marked this conversation as resolved.
Show resolved Hide resolved
rmccar marked this conversation as resolved.
Show resolved Hide resolved
expect($('.ons-js-address-manual-btn').attr('href')).toBe('https://example.com/edit-address');
expect($('.ons-js-address-manual-btn').text().trim()).toBe('Manually enter address');
});
});
});

describe('GIVEN: fieldset', () => {
balibirchlee marked this conversation as resolved.
Show resolved Hide resolved
describe('WHEN: `dontWrap` is `true`', () => {
describe('WHEN: dontWrap is true', () => {
const faker = templateFaker();
const fieldsetSpy = faker.spy('fieldset', { suppressOutput: true });

Expand All @@ -361,12 +361,12 @@ describe('FOR: address-input', () => {
dontWrap: true,
});

test('THEN: it does not render `fieldset` component`', () => {
test('THEN: it does not render fieldset component', () => {
expect(fieldsetSpy.occurrences.length).toBe(0);
});
});

describe('WHEN: `dontWrap` is not set', () => {
describe('WHEN: dontWrap is not set', () => {
const faker = templateFaker();
const fieldsetSpy = faker.spy('fieldset', { suppressOutput: true });

Expand All @@ -376,7 +376,7 @@ describe('FOR: address-input', () => {
legendClasses: 'extra-legend-class',
});

test('THEN: it renders `fieldset` component with expected parameters', () => {
test('THEN: it renders the fieldset component with expected parameters', () => {
expect(fieldsetSpy.occurrences[0]).toEqual({
id: 'address-input-example-id',
classes: 'extra-field-class',
Expand Down
Loading