Enforce data-test-* selector lint rules across root-config packages

[burieberry]

Summary

data-test-* attributes are stripped from production builds by ember-test-selectors, so using them as CSS/DOM selectors (e.g. querySelector('[data-test-foo]') or [data-test-foo] { ... } in a <style> block) works in tests but silently breaks everywhere else. This PR closes the gaps where that guard wasn't being applied.

Changes

• Shared selector definition. Extracted the no-restricted-syntax selectors into eslint/data-test-selectors.cjs and re-export them from the root .eslintrc.js. Packages with their own root: true config don't inherit the monorepo root, so they import and re-declare the guard from this shared module instead of duplicating the selectors.
• Applied the ESLint guard to source/app code in packages/host, packages/boxel-ui/addon, and packages/boxel-ui/test-app, and to contents/ card code in packages/catalog — each scoped so tests, which legitimately select on data-test-*, are exempt.
• Template lint coverage. The no-data-test-selector template rule now also scans <style> blocks (CSS lives in a raw TextNode, so attribute selectors there were previously missed), and the plugin's recommended config now exempts test templates (tests/, *-test.*, *.test.*).
• Wired up software-factory template linting. Added a .template-lintrc.js, the ember-template-lint dependency, and lint:hbs / lint:hbs:fix scripts so its realm/ .gts files are linted. Fixed the two violations this surfaced: a malformed template-lint-disable comment in document.gts and this.args.model → @model usage in test-results.gts.

Verification

• ember-template-lint realm lints all 20 files (18 .gts + 2 .test.gts) with zero errors.
• No remaining non-test [data-test- selector usages in the newly-covered source/content directories.

[github-actions]

Preview deployments

• Host staging preview

• Host production preview

• Boxel UI staging preview

Host Test Results

    1 files      1 suites   2h 30m 11s ⏱️
3 272 tests 3 256 ✅ 15 💤 0 ❌ 1 🔥
3 291 runs  3 274 ✅ 15 💤 1 ❌ 1 🔥

Results for commit 1f9a645.

For more details on these errors, see this check.

Realm Server Test Results

    1 files      1 suites   8m 12s ⏱️
1 663 tests 1 663 ✅ 0 💤 0 ❌
1 742 runs  1 742 ✅ 0 💤 0 ❌

Results for commit 1f9a645.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 85fbc2c031

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[backspace]

This seems unrelated to the lint rule, is it an inclusion from elsewhere?

[burieberry]

Yes sorry it’s unrelated. Noticed this regression while fixing the lint error on that file

[Copilot]

Pull request overview

This PR tightens production-safety around data-test-* usage by enforcing lint guards against using test hooks as runtime selectors (CSS/DOM), and by expanding template-lint coverage to catch [data-test- inside <style> blocks. It also wires ember-template-lint into packages/software-factory so its .gts realm files are checked consistently.

Changes:

• Centralized the ESLint no-restricted-syntax selectors for banning [data-test- into eslint/data-test-selectors.cjs, and applied them in package-level root: true ESLint configs.
• Extended the template-lint rule no-data-test-selector to also scan raw <style> text nodes, and updated the plugin recommended config to exempt test templates.
• Added ember-template-lint + scripts/config to packages/software-factory, and fixed the newly surfaced violations; updated a few templates/styles to use non-test data-* hooks where needed.

Reviewed changes

Copilot reviewed 14 out of 15 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
eslint/data-test-selectors.cjs	New shared ESLint selector definitions/messages for banning [data-test- usage as a runtime selector.
.eslintrc.js	Reuses the shared DATA_TEST_SELECTORS module and applies it to app/ and src/ code.
packages/host/.eslintrc.js	Adds an app-code override to enforce the shared data-test-* selector ban in a root: true package.
packages/boxel-ui/addon/.eslintrc.cjs	Adds a src/ override enforcing the shared data-test-* selector ban.
packages/boxel-ui/test-app/.eslintrc.js	Adds an app/ override enforcing the shared data-test-* selector ban.
packages/catalog/.eslintrc.cjs	Enforces the ban in contents/ card code while exempting test files from the data-test portion of no-restricted-syntax.
packages/template-lint/lib/no-data-test-selector.mjs	Improves rule messaging and adds scanning for [data-test- inside <style> blocks.
packages/template-lint/plugin.mjs	Updates recommended config to disable no-data-test-selector for test templates by path/name patterns.
packages/software-factory/.template-lintrc.cjs	Adds template-lint configuration so realm/ .gts files are linted.
packages/software-factory/package.json	Adds ember-template-lint dependency and lint:hbs scripts.
packages/software-factory/realm/document.gts	Fixes a malformed template-lint directive so it correctly disables the intended rule.
packages/software-factory/realm/test-results.gts	Fixes template access to use @model rather than this.args.model.
packages/base/default-templates/card-info.gts	Adds a non-test data-* hook and switches styling away from [data-test-*] selectors.
packages/experiments-realm/product.gts	Removes a data-test-* CSS selector usage in a <style> block.
pnpm-lock.yaml	Lockfile updates reflecting the new dependency/config changes.

Files not reviewed (1)

• pnpm-lock.yaml: Generated file

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.