Fix stylelint errors on border: usage with custom vars

Fixed: 1442257
Change-Id: Idbfab3c09655303ffd7e8ca383f87ec3cf89465b
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/4660608
Commit-Queue: Jack Franklin <jacktfranklin@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>
Reviewed-by: Alex Rudenko <alexrudenko@chromium.org>
This commit is contained in:
Jack Franklin
2023-07-03 10:57:30 +00:00
committed by Devtools-frontend LUCI CQ
parent 5bebce90a8
commit 4f68dfdb98
2 changed files with 7 additions and 1 deletions
@@ -33,7 +33,7 @@ const CSS_PROPS_TO_CHECK_FOR_COLOR_USAGE = new Set([
'outline'
]);
const borderCombinedDeclarations = new Set(['border-top', 'border-bottom', 'border-left', 'border-right']);
const borderCombinedDeclarations = new Set(['border', 'border-top', 'border-bottom', 'border-left', 'border-right']);
const COLOR_INDICATOR_REGEXES = new Set([
// We don't have to check for named colors ("blue") as we lint to ban those separately.
@@ -239,6 +239,12 @@ describe('use_theme_colors', () => {
]);
});
it('does not error when there is a var for the border width', async () => {
const warnings = await lint('p { border: var(--button-border-size) solid var(--color-primary); }');
assert.lengthOf(warnings, 0);
});
it('is silent when linting code that has an empty var()', async () => {
/**
* This is a weird test case but if you've got Stylelint in your editor and