diff --git a/manage/manage.js b/manage/manage.js index ab855de2..6084fdfa 100644 --- a/manage/manage.js +++ b/manage/manage.js @@ -21,7 +21,7 @@ const newUI = { }, }; newUI.renderClass(); -usePrefsDuringPageLoad(); +requestAnimationFrame(usePrefsDuringPageLoad); const TARGET_TYPES = ['domains', 'urls', 'urlPrefixes', 'regexps']; const GET_FAVICON_URL = 'https://www.google.com/s2/favicons?domain='; @@ -600,40 +600,21 @@ function rememberScrollPosition() { function usePrefsDuringPageLoad() { - const observer = new MutationObserver(mutations => { - const adjustedNodes = []; - for (const mutation of mutations) { - for (const node of mutation.addedNodes) { - // [naively] assuming each element of addedNodes is a childless element - const key = node.dataset && node.dataset.pref || node.id; - const prefValue = key ? prefs.readOnlyValues[key] : undefined; - if (prefValue !== undefined) { - if (node.type === 'checkbox') { - node.checked = prefValue; - } else if (node.localName === 'details') { - node.open = prefValue; - } else { - node.value = prefValue; - } - if (node.adjustWidth) { - adjustedNodes.push(node); - } - } - } + for (const id of Object.getOwnPropertyNames(prefs.readOnlyValues)) { + const value = prefs.readOnlyValues[id]; + if (value !== true) continue; + const el = document.getElementById(id) || + id.includes('expanded') && $(`details[data-pref="${id}"]`); + if (!el) continue; + if (el.type === 'checkbox') { + el.checked = value; + } else if (el.localName === 'details') { + el.open = value; + } else { + el.value = value; } - if (adjustedNodes.length) { - observer.disconnect(); - for (const node of adjustedNodes) { - node.adjustWidth(); - } - startObserver(); - } - }); - function startObserver() { - observer.observe(document, {subtree: true, childList: true}); } - startObserver(); - onDOMready().then(() => observer.disconnect()); + $$('#header select').forEach(el => el.adjustWidth()); }