PLATUI-3352: integrate fixes from adams polyfill for accessible autocomplete #424
Conversation
oscarduignan
changed the title
oscarduignan
force-pushed
the
PLATUI-3352-integrate-fixes-from-adams-polyfill
branch
from
6f6f98b to
2c1fe77
Compare
| @@ -17,6 +17,7 @@ AccessibleAutoComplete.prototype.init = function init() { | |||
| autoselect, | |||
| defaultValue, | |||
| minLength, | |||
| confirmOnBlur: true, | |||
There was a problem hiding this comment.
just added to check, it's the default but I think I've misunderstood something about how this works - because should select a matching option in the underlying select when input is changed if there is one isn't working as I would expect
oscarduignan
force-pushed
the
PLATUI-3352-integrate-fixes-from-adams-polyfill
branch
from
2c1fe77 to
7671c56
Compare
oscarduignan
force-pushed
the
PLATUI-3352-integrate-fixes-from-adams-polyfill
branch
from
7671c56 to
2bf9f07
Compare
|
finished the initial tests for this I think, I've marked the ones that won't work until we implement the fixes as failing so they could be merged ahead of other one if we want to review the tests for now |
| */ | ||
| function render(componentName, params, children = false) { | ||
| function renderString(componentName, params, children = false) { |
There was a problem hiding this comment.
split this out because I wanted the string, could have possibly gotten the string back out from cheerio though instead, :hmm:
| it.failing('should select any option with exactly matching text on blur, even if it was not chosen from the suggestions', async () => { | ||
| await render(page, withGovukSelect({ | ||
| id: 'location', | ||
| name: 'location', | ||
| attributes: { | ||
| 'data-module': 'hmrc-accessible-autocomplete', | ||
| 'data-auto-select': 'false', | ||
| // this is the default, but included to be explicit with test state | ||
| // auto select would mean that you don't have to enter exactly matching | ||
| // text to select on blur | ||
| }, | ||
| label: { | ||
| text: 'Choose location', | ||
| }, | ||
| items: [ | ||
| { | ||
| value: ' ', | ||
| text: 'Choose location', | ||
| }, | ||
| { | ||
| value: 'london', | ||
| text: 'London', | ||
| }, | ||
| { | ||
| value: 'southwest', | ||
| text: 'South West', | ||
| }, | ||
| ], | ||
| })); | ||
|
|
||
| await expect(page).toFill('#location', 'Lon'); | ||
| await acceptFirstSuggestionFor('#location'); | ||
| expect(await page.$eval('select', (select) => select.value)).toBe('london'); | ||
| await expect(page).toFill('#location', 'South West'); | ||
| await page.$eval('#location', (input) => input.blur()); | ||
| expect(await page.$eval('select', (select) => select.value)).toBe('southwest'); | ||
| }); |
There was a problem hiding this comment.
this is the bit that I thought was additional behaviour, but actually I think adam's patch will be achieving this, it's just that my approach that I proof of concepted wouldn't be - onConfirm will get "undefined" in this case, so you have to in this case lookup the current value of the autocomplete input instead and use that to mark an option as selected
|
I'll update changelog tomorrow and mark ready for review, can merge these new tests in now - and in the implementation PR just remove the ".failing" modifier from the ones we are implementing |
No description provided.