Skip to content

[4.0] Update choices.js and fix a bug with detaching #23455

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

Closed
Fedik wants to merge 6 commits into from
Closed

[4.0] Update choices.js and fix a bug with detaching #23455

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
95a903c
Update choices.js and fix a bug with detaching
Fedik Jan 5, 2019
0439bec
Make sure Choices are loaded
Fedik Jan 7, 2019
de26718
Merge branch '4.0-dev' into choices-update
wilsonge Jan 9, 2019
27a7fe7
Update package-lock.json
Fedik Jan 10, 2019
351d60b
Merge branch '4.0-dev' into choices-update
wilsonge Jan 10, 2019
2fd702a
Merge branch '4.0-dev' into choices-update
infograf768 Jan 12, 2019
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
8 changes: 4 additions & 4 deletions build/build-modules-js/settings.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,12 +158,12 @@
"choices.js": {
"name": "choicesjs",
"js": {
"assets/scripts/dist/choices.js": "js/choices.js",
"assets/scripts/dist/choices.min.js": "js/choices.min.js"
"public/assets/scripts/choices.js": "js/choices.js",
"public/assets/scripts/choices.min.js": "js/choices.min.js"
},
"css": {
"assets/styles/css/choices.css": "css/choices.css",
"assets/styles/css/choices.min.css": "css/choices.min.css"
"public/assets/styles/choices.css": "css/choices.css",
"public/assets/styles/choices.min.css": "css/choices.min.css"
},
"provideAssets": [
{
Expand Down
34 changes: 25 additions & 9 deletions build/media/webcomponents/js/field-fancy-select/field-fancy-select.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/**
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @copyright Copyright (C) 2005 - 2019 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

Expand Down Expand Up @@ -42,6 +42,24 @@
set value($val) { this.choicesInstance.setValueByChoice('' + $val); }

connectedCallback() {
// Make sure Choices are loaded
if (window.Choices || document.readyState === 'complete') {
this._doConnect();
} else {
const callback = () => {
this._doConnect();
window.removeEventListener('load', callback);
};
window.addEventListener('load', callback);
}
}

_doConnect() {
// The element was already initialised previously and perhaps was detached from DOM
if (this.choicesInstance) {
return;
}

if (!window.Choices) {
throw new Error('JoomlaFieldFancySelect require Choices.js to work');
}
Expand Down Expand Up @@ -111,7 +129,7 @@
// Handle remote search
if (this.remoteSearch && this.url) {
// Cache existing
this.choicesInstance.presetChoices.forEach((choiceItem) => {
this.choicesInstance.config.choices.forEach((choiceItem) => {
this.choicesCache[choiceItem.value] = choiceItem.label;
});

Expand All @@ -126,14 +144,8 @@
}

disconnectedCallback() {
// Destroy Choices instance, to unbind an event listeners
if (this.choicesInstance) {
Copy link
Copy Markdown
Contributor

@dgrammatiko dgrammatiko Jan 5, 2019

Choose a reason for hiding this comment

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

Actually this part is correct. You need to destroy the current instance and recreate it. The missing part here is that you need a value attribute in the custom element that keeps the value (json). Also if you do it this way I guess you can skip the select element altogether and just create hidden input with the value so PHP is also happy...

this.choicesInstance.destroy();
this.choicesInstance = null;
}
if (this.activeXHR){
if (this.activeXHR) {
this.activeXHR.abort();
this.activeXHR = null;
}
}

Expand All @@ -158,8 +170,12 @@
let item;
for(let i = items.length - 1; i >= 0; i--) {
item = items[i];
item.value = '' + item.value; // Make sure the value is a string, choices.js expect a string.

if (this.choicesCache[item.value]) {
items.splice(i, 1);
} else {
this.choicesCache[item.value] = item.text;
}
}

Expand Down
56 changes: 27 additions & 29 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@
"@webcomponents/webcomponentsjs": "2.1.2",
"awesomplete": "github:LeaVerou/awesomplete",
"bootstrap": "4.1.3",
"choices.js": "^3.0.4",
Copy link
Copy Markdown
Contributor

@wilsonge wilsonge Jan 9, 2019

Choose a reason for hiding this comment

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

Please update the package lock

Copy link
Copy Markdown
Member Author

@Fedik Fedik Jan 10, 2019

Choose a reason for hiding this comment

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

done

"choices.js": "^4.1.0",
"chosen-js": "1.6.2",
"codemirror": "5.38.0",
"cropperjs": "1.2.2",
Expand Down