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.

Sign up for GitHub

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

Jump to bottom

fix(multi select): fix for safari - FRONT-3910 #2825

Merged
merged 5 commits into from
Apr 13, 2023
Merged

fix(multi select): fix for safari - FRONT-3910 #2825

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
0b43591
add missing name
emeryro Apr 5, 2023
9ac57d4
reproduce issue
emeryro Apr 11, 2023
49e4492
possible fix
emeryro Apr 13, 2023
df96436
cleanup
emeryro Apr 13, 2023
85198ac
Merge branch 'v3-dev' into FRONT-3910-safari-multi-select
emeryro Apr 13, 2023
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
7 changes: 7 additions & 0 deletions src/implementations/twig/components/select/__snapshots__/select.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ exports[`Select Default renders correctly 1`] = `
<select
class="ecl-select"
id="select-default"
name="country"
>
<optgroup
label="European countries"
Expand Down Expand Up @@ -146,6 +147,7 @@ exports[`Select Default renders correctly with extra attributes 1`] = `
data-test="data-test-value"
data-test-1="data-test-value-1"
id="select-default"
name="country"
required=""
>
<optgroup
Expand Down Expand Up @@ -264,6 +266,7 @@ exports[`Select Default renders correctly with extra class names 1`] = `
<select
class="ecl-select custom-class custom-class--test"
id="select-default"
name="country"
required=""
>
<optgroup
Expand Down Expand Up @@ -383,6 +386,7 @@ exports[`Select Disabled renders correctly 1`] = `
class="ecl-select"
disabled=""
id="select-default"
name="country"
>
<optgroup
label="European countries"
Expand Down Expand Up @@ -509,6 +513,7 @@ exports[`Select Multiple renders correctly 1`] = `
data-ecl-select-search="Enter keyword"
id="select-multiple"
multiple=""
name="country"
required=""
>
<optgroup
Expand Down Expand Up @@ -626,6 +631,7 @@ exports[`Select Required renders correctly 1`] = `
<select
class="ecl-select"
id="select-default"
name="country"
required=""
>
<optgroup
Expand Down Expand Up @@ -758,6 +764,7 @@ exports[`Select With error renders correctly 1`] = `
<select
class="ecl-select"
id="select-default"
name="country"
>
<optgroup
label="European countries"
Expand Down
9 changes: 1 addition & 8 deletions src/implementations/vanilla/components/select/select.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -220,7 +220,7 @@ export class Select {
}

/**
* Manually checks an ECL-specific checkbox when previously defualt has been prevented.
* Manually checks an ECL-specific checkbox when previously default has been prevented.
* @param {Event} e
*/
static checkCheckbox(e) {
Expand Down Expand Up @@ -578,11 +578,9 @@ export class Select {
Array.from(this.select.options).forEach((option) => {
if (option.text === checkbox.getAttribute('data-select-multiple-value')) {
if (option.getAttribute('selected') || option.selected) {
option.removeAttribute('selected');
option.selected = false;
this.selectAll.querySelector('input').checked = false;
} else {
option.setAttribute('selected', 'selected');
option.selected = true;
}
}
Expand Down Expand Up @@ -615,10 +613,8 @@ export class Select {

if (option) {
if (checked) {
option.setAttribute('selected', 'selected');
option.selected = true;
} else {
option.removeAttribute('selected', 'selected');
option.selected = false;
}
}
Expand Down Expand Up @@ -976,7 +972,6 @@ export class Select {
);
const input = checkbox.querySelector('.ecl-checkbox__input');
input.checked = false;
option.removeAttribute('selected', 'selected');
option.selected = false;
});

Expand All @@ -997,10 +992,8 @@ export class Select {
);
const input = checkbox.querySelector('.ecl-checkbox__input');
if (input.checked) {
option.setAttribute('selected', 'selected');
option.selected = true;
} else {
option.removeAttribute('selected', 'selected');
option.selected = false;
}
});
Expand Down
1 change: 1 addition & 0 deletions src/specs/components/select/demo/data-multiple.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
module.exports = {
id: 'select-multiple',
label: 'Select a country',
name: 'country',
helper_text: 'This is the helper text.',
invalid_text: 'Error message',
invalid_icon: {
Expand Down
1 change: 1 addition & 0 deletions src/specs/components/select/demo/data-single.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
module.exports = {
id: 'select-default',
label: 'Select a country',
name: 'country',
helper_text: "This is the input's helper text.",
invalid_text: 'This is the error message',
invalid_icon: {
Expand Down