|
|
@@ -24,7 +24,6 @@ const sheets = Object.fromEntries(SHEETS.map(name => [name, readFileSync(
|
|
|
fileURLToPath(new URL(`../src/client/${name}.module.css`, import.meta.url)),
|
|
|
'utf8',
|
|
|
)])) as Record<(typeof SHEETS)[number], string>
|
|
|
-const css = sheets.MessageFeedbackActions
|
|
|
// The theme package maps `./styles/*` to `./src/styles/*`, so the declarations
|
|
|
// stay on the source plane rather than needing a build. Every theme sheet, not
|
|
|
// just the platform tokens: font and scrollbar variables are declared in
|
|
|
@@ -36,12 +35,14 @@ const tokens = readdirSync(fileURLToPath(new URL('../../ui-theme/src/styles/', i
|
|
|
|
|
|
/**
|
|
|
* The declarations of one top-level rule, by selector.
|
|
|
+ * @param sheetName - the stylesheet containing the rule.
|
|
|
* @param selector - the class selector to read, including its leading dot.
|
|
|
* @returns the rule's declaration text.
|
|
|
*/
|
|
|
-function block(selector: string): string {
|
|
|
- const match = new RegExp(`^\\${selector} \\{([^}]*)\\}`, 'm').exec(css)
|
|
|
- if (match === null) throw new Error(`MessageFeedbackActions.module.css has no \`${selector}\` rule`)
|
|
|
+function block(sheetName: (typeof SHEETS)[number], selector: string): string {
|
|
|
+ const escapedSelector = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
|
|
|
+ const match = new RegExp(`^${escapedSelector} \\{([^}]*)\\}`, 'm').exec(sheets[sheetName])
|
|
|
+ if (match === null) throw new Error(`${sheetName}.module.css has no \`${selector}\` rule`)
|
|
|
return match[1] ?? ''
|
|
|
}
|
|
|
|
|
|
@@ -82,8 +83,25 @@ describe('MessageFeedbackActions row styles', () => {
|
|
|
// These buttons render inside ui-chat's MessageIconActions row; a fixed
|
|
|
// 28px would leave them undersized (or overflowing) once the Settings
|
|
|
// font size moves the row.
|
|
|
- expect(block('.action')).toMatch(/width:\s*calc\(28px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
- expect(block('.action')).toMatch(/height:\s*calc\(28px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
- expect(block('.action svg')).toMatch(/width:\s*calc\(15px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
+ expect(block('MessageFeedbackActions', '.action')).toMatch(/width:\s*calc\(28px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
+ expect(block('MessageFeedbackActions', '.action')).toMatch(/height:\s*calc\(28px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
+ expect(block('MessageFeedbackActions', '.action svg')).toMatch(/width:\s*calc\(15px \+ var\(--dsh-content-font-delta, 0px\)\)/)
|
|
|
+ })
|
|
|
+
|
|
|
+ it('uses the tertiary label colour for recorded rating icons', () => {
|
|
|
+ expect(block('MessageFeedbackActions', '.action[data-active]'))
|
|
|
+ .toMatch(/color:\s*var\(--dsw-alias-label-tertiary\)/)
|
|
|
+ })
|
|
|
+})
|
|
|
+
|
|
|
+describe('FeedbackDialog layout styles', () => {
|
|
|
+ it('uses the reviewed spacing, text colours, and submit-button geometry', () => {
|
|
|
+ expect(block('FeedbackDialog', '.dialog.dialog')).toMatch(/gap:\s*38px/)
|
|
|
+ expect(block('FeedbackDialog', '.categories')).toMatch(/margin-top:\s*-14px/)
|
|
|
+ expect(block('FeedbackDialog', '.chip')).toMatch(/color:\s*var\(--dsw-alias-label-primary\)/)
|
|
|
+ expect(block('FeedbackDialog', '.detail::placeholder')).toMatch(/color:\s*var\(--dsw-alias-label-caption\)/)
|
|
|
+ expect(block('FeedbackDialog', '.detail')).toMatch(/border-radius:\s*16px/)
|
|
|
+ expect(block('FeedbackDialog', '.submit')).toMatch(/border-radius:\s*18px/)
|
|
|
+ expect(block('FeedbackDialog', '.submit')).toMatch(/font-weight:\s*500/)
|
|
|
})
|
|
|
})
|
yx.zhang