.stylelintrc.js

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this
   3  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 /* eslint-env node */
   6
   7 "use strict";
   8
   9 const fs = require("fs");
  10 const path = require("path");
  11
  12 function readFile(path) {
  13   return fs
  14     .readFileSync(path, { encoding: "utf-8" })
  15     .split("\n")
  16     .filter(p => p && !p.startsWith("#"));
  17 }
  18
  19 const ignoreFiles = [
  20   ...readFile(
  21     path.join(__dirname, "tools", "rewriting", "ThirdPartyPaths.txt")
  22   ),
  23   ...readFile(path.join(__dirname, "tools", "rewriting", "Generated.txt")),
  24 ];
  25
  26 module.exports = {
  27   extends: ["stylelint-config-recommended"],
  28   ignoreFiles,
  29   rules: {
  30     /* Disabled because of `-moz-element(#foo)` which gets misparsed. */
  31     "color-no-invalid-hex": null,
  32     "font-family-no-missing-generic-family-keyword": [
  33       true,
  34       {
  35         ignoreFontFamilies: [
  36           "-moz-button",
  37           "-moz-field",
  38           "-moz-fixed",
  39           "-moz-list",
  40           "caption",
  41         ],
  42       },
  43     ],
  44
  45     "function-no-unknown": [
  46       true,
  47       {
  48         ignoreFunctions: [
  49           "light-dark" /* Used for color-scheme dependent colors */,
  50           "-moz-image-rect" /* Used for cropping images */,
  51           "-moz-themed" /* Used for native widget rendering */,
  52           "add" /* Used in mathml.css */,
  53         ],
  54       },
  55     ],
  56
  57     "no-descending-specificity": null,
  58     "no-duplicate-selectors": null,
  59
  60     "property-no-unknown": [
  61       true,
  62       {
  63         ignoreProperties: ["overflow-clip-box"],
  64       },
  65     ],
  66
  67     /*
  68      * XXXgijs: we would like to enable this, but we can't right now.
  69      * This is because Gecko uses a number of custom pseudoclasses,
  70      * and stylelint assumes that for `:unknown-pseudoclass(foo)`,
  71      * `foo` should be a known type.
  72      * This is tedious but workable for things like `-moz-locale-dir` where
  73      * the set of acceptable values (ltr/rtl) is small.
  74      * However, for tree cells, the set of values is unlimited (ie
  75      * user-defined, based on atoms sent by the JS tree view APIs).
  76      * There does not appear to be a way to exempt the contents of these
  77      * unknown pseudoclasses, and as a result, this rule is not
  78      * usable for us. The 'type' only includes the contents of the
  79      * pseudoclass, not the pseudo itself, so we can't filter based on the
  80      * pseudoclass either.
  81      * Ideally, we would either create an option to the builtin rule
  82      * in stylelint itself, or mimic the rule but exempt these, or
  83      * add parser support for our custom pseudoclasses.
  84      *
  85      * For now, we just disable this rule.
  86      */
  87     "selector-type-no-unknown": null,
  88     /*
  89      * See above - if we enabled this rule, we'd have to allow for a number
  90      * of custom elements we use, which are listed here:
  91     "selector-type-no-unknown": [
  92       true,
  93       {
  94         ignore: ["custom-elements"],
  95         ignoreTypes: [
  96           // Modern custom element / storybooked components:
  97           /^moz-/,
  98           // moz-locale-dir trips this rule for some reason:
  99           "rtl",
 100           "ltr",
 101           // Migrated XBL elements not part of core XUL that we use at the moment:
 102           "findbar",
 103           "panelmultiview",
 104           "panelview",
 105           "popupnotification",
 106           "popupnotificationcontent",
 107           // Legacy XUL elements:
 108           // (the commented out ones used to be a thing and aren't used in-tree anymore)
 109           "arrowscrollbox",
 110           "box",
 111           // "broadcaster",
 112           // "broadcasterset",
 113           "button",
 114           "browser",
 115           "checkbox",
 116           "caption",
 117           // clicktoscroll
 118           // colorpicker
 119           // column
 120           // columns
 121           "commandset",
 122           "command",
 123           // conditions
 124           // content
 125           // datepicker
 126           "deck",
 127           "description",
 128           "dialog",
 129           // dialogheader
 130           "dropmarker",
 131           "editor",
 132           // grid
 133           // grippy
 134           "groupbox",
 135           "hbox",
 136           // iframe
 137           // image
 138           "key",
 139           "keyset",
 140           // label
 141           "listbox",
 142           // listcell
 143           // listcol
 144           // listcols
 145           // listhead
 146           // listheader
 147           "listitem",
 148           // member
 149           "menu",
 150           "menubar",
 151           "menucaption",
 152           "menuitem",
 153           "menulist",
 154           "menupopup",
 155           "menuseparator",
 156           "notification",
 157           "notificationbox",
 158           "observes",
 159           // overlay
 160           // page
 161           "panel",
 162           // param
 163           "popupset",
 164           // preference
 165           // preferences
 166           // prefpane
 167           // prefwindow
 168           // progressmeter
 169           // query
 170           // queryset
 171           "radio",
 172           "radiogroup",
 173           // resizer
 174           "richlistbox",
 175           "richlistitem",
 176           // row
 177           // rows
 178           // rule
 179           // scale
 180           // script
 181           "scrollbar",
 182           "scrollbox",
 183           "scrollcorner",
 184           "separator",
 185           "spacer",
 186           // spinbuttons
 187           "splitter",
 188           "stack",
 189           // statusbar
 190           // statusbarpanel
 191           "stringbundle",
 192           "stringbundleset",
 193           "tab",
 194           "tabbox",
 195           "tabpanel",
 196           "tabpanels",
 197           "tabs",
 198           // template
 199           // textnode
 200           "textbox",
 201           // timepicker
 202           "titlebar",
 203           "toolbar",
 204           "toolbarbutton",
 205           // toolbargrippy
 206           "toolbaritem",
 207           "toolbarpalette",
 208           "toolbarpaletteitem",
 209           "toolbarseparator",
 210           "toolbarset",
 211           "toolbarspacer",
 212           "toolbarspring",
 213           "toolbartabstop",
 214           "toolbox",
 215           "tooltip",
 216           "tree",
 217           "treecell",
 218           "treechildren",
 219           "treecol",
 220           "treecols",
 221           "treeitem",
 222           "treerow",
 223           "treeseparator",
 224           // triple
 225           "vbox",
 226           // where
 227           "window",
 228           "wizard",
 229           "wizardpage",
 230         ],
 231       },
 232     ],
 233     */
 234
 235     "selector-pseudo-class-no-unknown": [
 236       true,
 237       {
 238         ignorePseudoClasses: ["popover-open"],
 239       },
 240     ],
 241   },
 242
 243   overrides: [
 244     {
 245       // TODO: Bug 1851544: Re-enable the rule or change the rule set-up.
 246       files: [
 247         "browser/components/newtab/content-src/aboutwelcome/aboutwelcome.scss",
 248         "browser/components/newtab/content-src/asrouter/components/ModalOverlay/_ModalOverlay.scss",
 249         "browser/components/newtab/content-src/asrouter/templates/SimpleBelowSearchSnippet/_SimpleBelowSearchSnippet.scss",
 250         "browser/components/newtab/content-src/components/CustomizeMenu/_CustomizeMenu.scss",
 251         "browser/components/newtab/content-src/components/DiscoveryStreamComponents/CardGrid/_CardGrid.scss",
 252         "browser/components/newtab/content-src/components/Search/_Search.scss",
 253       ],
 254       rules: {
 255         "media-feature-range-notation": null,
 256       },
 257     },
 258     {
 259       files: "*.scss",
 260       customSyntax: "postcss-scss",
 261       extends: "stylelint-config-recommended-scss",
 262     },
 263     {
 264       files: "browser/components/newtab/**",
 265       customSyntax: "postcss-scss",
 266       extends: "stylelint-config-standard-scss",
 267       rules: {
 268         "at-rule-disallowed-list": [
 269           ["debug", "warn", "error"],
 270           {
 271             message: "Clean up %s directives before committing",
 272           },
 273         ],
 274         "at-rule-no-vendor-prefix": null,
 275         "color-function-notation": null,
 276         "color-hex-case": "upper",
 277         "comment-empty-line-before": [
 278           "always",
 279           {
 280             except: ["first-nested"],
 281             ignore: ["after-comment", "stylelint-commands"],
 282           },
 283         ],
 284         "custom-property-empty-line-before": null,
 285         "custom-property-pattern": null,
 286         "declaration-block-no-duplicate-properties": true,
 287         "declaration-block-no-redundant-longhand-properties": null,
 288         "declaration-no-important": true,
 289         "function-no-unknown": [
 290           true,
 291           {
 292             ignoreFunctions: ["div"],
 293           },
 294         ],
 295         "function-url-no-scheme-relative": true,
 296         indentation: 2,
 297         "keyframes-name-pattern": null,
 298         "max-nesting-depth": [
 299           8,
 300           {
 301             ignore: ["blockless-at-rules", "pseudo-classes"],
 302           },
 303         ],
 304         "media-feature-name-no-vendor-prefix": null,
 305         "no-descending-specificity": null,
 306         "no-eol-whitespace": true,
 307         "no-missing-end-of-source-newline": true,
 308         "number-leading-zero": "always",
 309         "number-no-trailing-zeros": true,
 310         "property-disallowed-list": [
 311           ["margin-left", "margin-right"],
 312           {
 313             message: "Use margin-inline instead of %s",
 314           },
 315         ],
 316         "property-no-unknown": true,
 317         "property-no-vendor-prefix": null,
 318         "scss/dollar-variable-empty-line-before": null,
 319         "scss/double-slash-comment-empty-line-before": [
 320           "always",
 321           {
 322             except: ["first-nested"],
 323             ignore: ["between-comments", "stylelint-commands", "inside-block"],
 324           },
 325         ],
 326         "selector-class-pattern": null,
 327         "selector-no-vendor-prefix": null,
 328         "string-quotes": [
 329           "single",
 330           {
 331             avoidEscape: true,
 332           },
 333         ],
 334         "value-keyword-case": null,
 335         "value-no-vendor-prefix": null,
 336       },
 337     },
 338   ],
 339 };