diff --git a/openless-all/app/scripts/aura-skin-contract.test.mjs b/openless-all/app/scripts/aura-skin-contract.test.mjs
index dbd1c230..49146e90 100644
--- a/openless-all/app/scripts/aura-skin-contract.test.mjs
+++ b/openless-all/app/scripts/aura-skin-contract.test.mjs
@@ -7,6 +7,31 @@ async function read(relPath) {
return readFile(new URL(relPath, root), 'utf8');
}
+function escapeRegExp(value) {
+ return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+
+function assertUsesClassName(source, className, message) {
+ const escapedClassName = escapeRegExp(className);
+ const patterns = [
+ new RegExp(`className\\s*=\\s*(?:\\{\\s*)?"[^"]*\\b${escapedClassName}\\b[^"]*"(?:\\s*\\})?`),
+ new RegExp(`className\\s*=\\s*(?:\\{\\s*)?'[^']*\\b${escapedClassName}\\b[^']*'(?:\\s*\\})?`),
+ new RegExp(`className\\s*=\\s*(?:\\{\\s*)?\`[^\`]*\\b${escapedClassName}\\b[^\`]*\`(?:\\s*\\})?`),
+ ];
+
+ assert.ok(patterns.some((pattern) => pattern.test(source)), message);
+}
+
+assert.throws(
+ () => assertUsesClassName('
ol-app-shell-bg
', 'ol-app-shell-bg', 'sample must require className usage'),
+ /sample must require className usage/,
+);
+assertUsesClassName(
+ '',
+ 'ol-app-shell-bg',
+ 'sample should accept className usage',
+);
+
const [tokens, globalCss, shell, settingsModal, overview] = await Promise.all([
read('src/styles/tokens.css'),
read('src/styles/global.css'),
@@ -24,11 +49,11 @@ assert.match(globalCss, /\.ol-app-shell-bg\b/, 'global.css must expose .ol-app-s
assert.match(globalCss, /\.ol-aura-panel\b/, 'global.css must expose .ol-aura-panel');
assert.doesNotMatch(globalCss, /@keyframes ol-aura-halo/, 'global.css must not add an animated halo');
-assert.match(shell, /ol-app-shell-bg/, 'FloatingShell must use the app shell background class');
-assert.match(shell, /ol-aura-sidebar/, 'FloatingShell must expose an Aura sidebar hook');
-assert.match(shell, /ol-aura-panel/, 'FloatingShell must expose an Aura panel hook');
+assertUsesClassName(shell, 'ol-app-shell-bg', 'FloatingShell must use the app shell background class');
+assertUsesClassName(shell, 'ol-aura-sidebar', 'FloatingShell must expose an Aura sidebar hook');
+assertUsesClassName(shell, 'ol-aura-panel', 'FloatingShell must expose an Aura panel hook');
-assert.match(settingsModal, /ol-aura-settings/, 'SettingsModal must expose an Aura settings wrapper');
-assert.match(overview, /ol-overview-hero/, 'Overview must expose a high-visibility overview surface hook');
+assertUsesClassName(settingsModal, 'ol-aura-settings', 'SettingsModal must expose an Aura settings wrapper');
+assertUsesClassName(overview, 'ol-overview-hero', 'Overview must expose a high-visibility overview surface hook');
console.log('Aura skin contract OK');