microsoft/vscode
1
0
Fork 0
mirror of https://github.com/microsoft/vscode.git synced 2026-07-08 02:43:11 -05:00
Code Issues Packages Projects Releases 177 Wiki Activity

Refactor design token validation to remove isNearMiss property and enhance gulpstylelint for explicit path handling

Browse Source
This commit is contained in:
mrleemurray
2026-06-11 11:50:44 +01:00
parent f861e7e217
commit 380ef5c19a
2 changed files with 22 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
build/lib/stylelint/validateDesignTokens.ts
View File

@@ -15,14 +15,6 @@ const ALLOWED_CODICON_PX = new Set([16, 12]);
export interface IDesignTokenViolation {
readonly line: number;
readonly message: string;
/**
* `true` when the codicon is sized in the 13-15px near-miss band, which is
* always meant to be 12 or 16. Off-ramp sizes outside that band (large
* hero/empty-state icons, small <=11px chevrons) set this `false` as they may
* be intentional. Used only to tailor the warning wording - all codicon
* size findings are reported as warnings and never fail the build.
*/
readonly isNearMiss: boolean;
}
/** Near-miss band: a codicon at 13/14/15px is always a mistake for 12 or 16. */
@@ -110,7 +102,7 @@ export function validateCodiconFontSizes(text: string): IDesignTokenViolation[]
return;
}
const nearMiss = isNearMiss(px);
violations.push({ line, isNearMiss: nearMiss, message: formatCodiconMessage(match[1], nearMiss) });
violations.push({ line, message: formatCodiconMessage(match[1], nearMiss) });
});
return violations;
@@ -162,7 +154,6 @@ export function validateFontSizeTokens(text: string): IDesignTokenViolation[] {
}
violations.push({
line,
isNearMiss: false,
message: `${match[1]}px -> ${suggestion}`
});
});
@@ -253,7 +244,6 @@ export function validateCornerRadiusTokens(text: string): IDesignTokenViolation[
const note = exact ? '' : ` (off-scale, ${token.px}px)`;
violations.push({
line,
isNearMiss: !exact,
message: `${pxMatch[1]}px -> var(--vscode-cornerRadius-${token.name})${note}`
});
});
@@ -342,7 +332,6 @@ export function validateFontWeightTokens(text: string): IDesignTokenViolation[]
const note = exact ? '' : ' (off-ramp, 400/600 only)';
violations.push({
line,
isNearMiss: !exact,
message: `${shown} -> var(--vscode-agents-fontWeight-${token.name})${note}`
});
});
@@ -437,7 +426,6 @@ export function validateSpacingTokens(text: string): IDesignTokenViolation[] {
}
violations.push({
line,
isNearMiss: true,
message: `${value} is off the spacing scale -> nearest: ${snapped.join(' ')} (${vars.join(' ')})`
});
});
@@ -481,7 +469,6 @@ export function validateStrokeTokens(text: string): IDesignTokenViolation[] {
}
violations.push({
line,
isNearMiss: false,
message: `${decl[1].trim()}: ${value.trim()} -> use var(--vscode-strokeThickness) for the 1px width`
});
});

29
build/stylelint.ts
View File

@@ -57,11 +57,13 @@ export default function gulpstylelint(reporter: Reporter, designTokensEverywhere
});
// Design-token checks that need block (selector + declaration) awareness.
// Scoped to the design-system area (src/vs/sessions). All findings are
// advisory warnings (never fail the build). Findings for a file are
// gathered, sorted by source line, then printed under a one-line file
// header as compact `path(line,col): [category] value -> var` rows so the
// terminal both groups them visually and linkifies each row.
// By default these are scoped to the design-system area (src/vs/sessions),
// but when `designTokensEverywhere` is set (an explicit path was targeted)
// they run on every linted file so the checks follow the requested scope.
// All findings are advisory warnings (never fail the build). Findings for a
// file are gathered, sorted by source line, then printed under a one-line
// file header as compact `path(line,col): [category] value -> var` rows so
// the terminal both groups them visually and linkifies each row.
const contents = file.contents.toString('utf8');
if (designTokensEverywhere || designSystemPattern.test(file.relative)) {
const findings: { line: number; category: string; message: string }[] = [];
@@ -107,7 +109,8 @@ export default function gulpstylelint(reporter: Reporter, designTokensEverywhere
});
}
function stylelint(sources: string[] = Array.from(stylelintFilter), designTokensEverywhere = false): NodeJS.ReadWriteStream {
function stylelint(sources: string[] = Array.from(stylelintFilter), explicit = false): NodeJS.ReadWriteStream {
let fileCount = 0;
return vfs
.src(sources, { base: '.', follow: true, allowEmpty: true })
.pipe(gulpstylelint((message, isError) => {
@@ -116,8 +119,18 @@ function stylelint(sources: string[] = Array.from(stylelintFilter), designTokens
} else {
console.info(message);
}
}, designTokensEverywhere))
.pipe(es.through(function () { /* noop, important for the stream to end */ }));
}, explicit))
.pipe(es.through(function (this, file: FileWithLines) {
fileCount++;
this.emit('data', file);
}, function () {
// When the caller targeted an explicit path that matched no CSS files,
// say so - otherwise a typo'd path looks like a clean run.
if (explicit && fileCount === 0) {
console.info('No CSS files matched the requested path: ' + sources.join(', '));
}
this.emit('end');
}));
}
/**