diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 1c95a62c..0d1ca784 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1087,6 +1087,10 @@ "message": "To allow access open , right-click the list, click 'New', then 'Boolean', paste and click OK, , OK, reload the page.", "description": "Note in the popup when opened on addons.mozilla.org in Firefox >= 59" }, + "unreachableAMOHintNewFF": { + "message": "In Firefox 60 and newer you'll also have to to remove AMO domain from in .", + "description": "Note in the popup when opened on addons.mozilla.org in Firefox >= 59" + }, "unreachableAMOHintOldFF": { "message": "Only Firefox 59 and newer can be configured to allow WebExtensions to add style elements on CSP-protected sites such as this one.", "description": "Note in the popup when opened on addons.mozilla.org in Firefox < 59" diff --git a/js/dom.js b/js/dom.js index ed12aaf1..674ee509 100644 --- a/js/dom.js +++ b/js/dom.js @@ -224,7 +224,9 @@ function $create(selector = 'div', properties, children) { const element = ns ? document.createElementNS(ns === 'SVG' || ns === 'svg' ? 'http://www.w3.org/2000/svg' : ns, tag) - : document.createElement(tag || 'div'); + : tag === 'fragment' + ? document.createDocumentFragment() + : document.createElement(tag || 'div'); for (const child of Array.isArray(children) ? children : [children]) { if (child) { diff --git a/popup/popup.js b/popup/popup.js index 801b00f7..df59a533 100644 --- a/popup/popup.js +++ b/popup/popup.js @@ -129,12 +129,14 @@ function initPopup() { const info = template.unreachableInfo; if (FIREFOX && tabURL.startsWith(URLS.browserWebStore)) { $('label', info).textContent = t('unreachableAMO'); - $('p', info).insertAdjacentElement('afterend', - $create('p', - t(FIREFOX < 59 ? 'unreachableAMOHintOldFF' : 'unreachableAMOHint') - .split(/(<.*?>)/) - .map(s => s[0] === '<' ? $create('b', s.slice(1, -1)) : s))); - $('p', info).remove(); + const note = (FIREFOX < 59 ? t('unreachableAMOHintOldFF') : t('unreachableAMOHint')) + + (FIREFOX < 60 ? '' : '\n' + t('unreachableAMOHintNewFF')); + const renderToken = s => s[0] === '<' ? $create('b', s.slice(1, -1)) : s; + const renderLine = line => $create('p', line.split(/(<.*?>)/).map(renderToken)); + const noteNode = $create('fragment', note.split('\n').map(renderLine)); + const target = $('p', info); + target.parentNode.insertBefore(noteNode, target); + target.remove(); } document.body.classList.add('unreachable'); document.body.insertBefore(info, document.body.firstChild);