Merge branch 'master' into USw-Integration

.github/workflows/ci.yml

@@ -7,7 +7,7 @@ jobs:
 
     steps:
       - uses: actions/checkout@v2
-      - uses: actions/setup-node@v1
+      - uses: actions/setup-node@v2
         with:
           node-version: '14'
       - run: npm install

global.css

@@ -1,7 +1,6 @@
-html#stylus #header *:not(#\0) {
-  /* This suppresses transitions on page open.
-   * WARNING! Must be the first rule here so dom.js can simply call deleteRule for index 0.
-   * Using an increased specificity to override sane selectors in user styles */
+html#stylus #header *:not(#\0transition-suppressor) {
+  /* This suppresses a bug in all? browsers: they apply transitions during page load.
+   * Using an increased specificity to override sane selectors in user styles. */
   transition: none !important;
 }
 body {

install-usercss/preinit.js

@@ -19,7 +19,7 @@ const preinit = (() => {
       .catch(getData);
   } else {
     getData = PortDownloader();
-    firstGet = getData({timer: false});
+    firstGet = getData({force: true});
   }
 
   function DirectDownloader() {

js/color/color-view.js

@@ -585,7 +585,22 @@
     if (palette.size > 1 || nums && nums.length > 1) {
       const old = new Map((options.popup.palette || []).map(el => [el.__color, el]));
       for (const [color, data] of palette) {
-        res.push(old.get(color) || makePaletteSwatch(color, data, options.popup.paletteLine));
+        const str = data.join(', ');
+        let el = old.get(color);
+        if (!el) {
+          el = document.createElement('div');
+          el.__color = color; // also used in color-picker.js
+          el.className = COLORVIEW_SWATCH_CLASS;
+          el.style.setProperty(`--${COLORVIEW_SWATCH_CLASS}`, color);
+        }
+        if (el.__str !== str) {
+          el.__str = str;
+          // break down long lists: 10 per line
+          el.title = `${color}\n${options.popup.paletteLine} ${
+            str.length > 50 ? str.replace(/([^,]+,\s){10}/g, '$&\n') : str
+          }`;
+        }
+        res.push(el);
       }
       res.push(Object.assign(document.createElement('span'), {
         className: 'colorpicker-palette-hint',
@@ -596,17 +611,6 @@
     return res;
   }
 
-  function makePaletteSwatch(color, nums, label) {
-    const s = nums.join(', ');
-    const el = document.createElement('div');
-    el.className = COLORVIEW_SWATCH_CLASS;
-    el.style.cssText = COLORVIEW_SWATCH_CSS + color;
-    // break down long lists: 10 per line
-    el.title = `${color}\n${label} ${s.length > 50 ? s.replace(/([^,]+,\s){10}/g, '$&\n') : s}`;
-    el.__color = color;
-    return el;
-  }
-
   function paletteCallback(el) {
     const {cm} = this;
     const lines = el.title.split('\n')[1].match(/\d+/g).map(Number);

js/dom.js

@@ -437,8 +437,16 @@ async function waitForSheet({
     window.on('resize', () => debounce(addTooltipsToEllipsized, 100));
   });
 
-  // Using `load` event as we need transition bug suppressor active until everything loads
-  window.on('load', () => $('link[href^="global.css"]').sheet.deleteRule(0), {once: true});
+  window.on('load', () => {
+    const {sheet} = $('link[href^="global.css"]');
+    for (let i = 0, rule; (rule = sheet.cssRules[i]); i++) {
+      // Not using \0 in the id as it's converted to \xFFFD, probably a bug
+      if (/#.transition-suppressor/.test(rule.selectorText)) {
+        sheet.deleteRule(i);
+        break;
+      }
+    }
+  }, {once: true});
 
   function addFaviconFF() {
     const iconset = ['', 'light/'][prefs.get('iconset')] || '';

privacy-policy.md

@@ -0,0 +1,9 @@
+# Privacy Policy
+
+Unlike other similar extensions, we don't find you to be all that interesting. Your questionable browsing history should remain between you and the NSA. Stylus collects nothing. Period.
+
+Again, **no data or personal information is collected by Stylus**.
+
+## Contact
+
+If you have any questions or suggestions regarding this privacy policy, do not hesitate to [contact us](stylus.openstyles@gmail.com).

tools/test.js

@@ -6,8 +6,8 @@ testGlobalCss();
 
 function testGlobalCss() {
   const css = fs.readFileSync('global.css', {encoding: 'utf8'});
-  const ERR = 'global.css: the first rule must be the transition suppressor';
-  const RX_SUPPRESSOR = /^[^{}]+{\s*transition:\s*none\s*!\s*important/i;
+  const ERR = 'global.css: missing the transition suppressor rule';
+  const RX_SUPPRESSOR = /[^{}]+#\\0transition-suppressor[^{}]+{\s*transition:\s*none\s*!\s*important/i;
   const RX_COMMENT = /\/\*([^*]|\*(?!\/))*(\*\/|$)/g;
   if (!RX_SUPPRESSOR.test(css.replace(RX_COMMENT, ''))) {
     console.error(ERR);