open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

auto-use fragment for multi-element templates

Browse Source
This commit is contained in:
tophf 2022-02-17 23:34:41 +03:00
parent d07e3bd87f
commit 4f0691431c
2 changed files with 9 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
js/localization.js
View File

@ -88,20 +88,20 @@ Object.assign(t, {
text.replace(t.RX_WORD_BREAK, '$&\u00AD'); text.replace(t.RX_WORD_BREAK, '$&\u00AD');
}, },
createTemplate(node) { createTemplate(el) {
const frag = 'fragment' in node.dataset; const {content} = el;
const el = frag ? node.content : node.content.firstElementChild;
t.NodeList(frag ? el.querySelectorAll('*') : el);
t.template[node.dataset.id] = el;
// Compress inter-tag whitespace to reduce DOM tree and avoid space between elements without flex
const toRemove = []; const toRemove = [];
const walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT); // Compress inter-tag whitespace to reduce DOM tree and avoid space between elements without flex
const walker = document.createTreeWalker(content, NodeFilter.SHOW_TEXT);
for (let n; (n = walker.nextNode());) { for (let n; (n = walker.nextNode());) {
if (!/[\xA0\S]/.test(n.textContent)) { // allow \xA0 to keep   if (!/[\xA0\S]/.test(n.textContent) || // allowing \xA0 so as to preserve  
n.nodeType === Node.COMMENT_NODE) {
toRemove.push(n); toRemove.push(n);
} }
} }
toRemove.forEach(n => n.remove()); toRemove.forEach(n => n.remove());
t.NodeList(content.querySelectorAll('*'));
t.template[el.dataset.id] = content.childNodes.length > 1 ? content : content.childNodes[0];
}, },
createText(str) { createText(str) {

2
options.html
View File

@ -20,7 +20,7 @@
<link rel="stylesheet" href="options/onoffswitch.css"> <link rel="stylesheet" href="options/onoffswitch.css">
<link rel="stylesheet" href="options/options.css"> <link rel="stylesheet" href="options/options.css">
<template data-id="shortcutsFF" data-fragment> <template data-id="shortcutsFF">
<p style="line-height: 1.5" i18n-text="shortcutsNoteFF"></p> <p style="line-height: 1.5" i18n-text="shortcutsNoteFF"></p>
<table style="margin: 0 auto"> <table style="margin: 0 auto">
<tr> <tr>