Skip to content

chore(angular): use Ionic lint and Prettier configs and add Playwright e2e tests - #1916

Merged
brandyscarney merged 1 commit into
mainfrom
chore/angular-standalone-tooling
Oct 27, 2026
Merged

brandyscarney merged 1 commit into
mainfrom
chore/angular-standalone-tooling

Conversation

@brandyscarney

@brandyscarney brandyscarney commented Oct 23, 2026 •

Copy link
Copy Markdown
Member

What This Does

Brings the angular-standalone starters in line with the Ionic tutorial app (tutorial-photo-gallery-angular), so an app created with ionic start has the same lint, formatting, and test setup the tutorials teach against.

New Behavior

Apps generated from the Angular standalone starters now:

  • Lint with @ionic/eslint-config alongside angular-eslint, including its template accessibility rules. They format .ts and .html files with Prettier and @ionic/prettier-config. npm run lint checks both and npm run lint:fix fixes both.
  • Include Playwright end-to-end tests in e2e/.
  • Use the scripts lint, lint:fix, test, test:unit, test:unit:watch, and test:e2e. npm test runs unit tests once, then e2e. It no longer starts Vitest in watch mode.
  • npm run lint also type-checks the Playwright tests and playwright.config.ts, which Playwright and ESLint don't do on their own.

Changes

  • base:
    • eslint.config.js now uses @ionic/eslint-config with angular-eslint.
    • Added Prettier config and .prettierignore (skips android/ and ios/).
    • Recommends the ESLint, Prettier, and Angular Language Service VS Code extensions.
    • Added playwright.config.ts.
    • Added Playwright output to .gitignore.
    • Added tsconfig.e2e.json and a typecheck:e2e script, run from lint, plus @types/node for playwright.config.ts.
  • Dependencies: added @ionic/eslint-config, @ionic/prettier-config, @playwright/test, and prettier.
  • angular.json:
    • The unit-test builder uses vitest.config.mts, which turns off Vitest's file-system module cache. With Angular's builder, that cache could serve a stale bundle after a non-spec file changed.
    • Removed the ci test configuration, since test:unit runs once.
    • ng lint now also lints e2e/ and playwright.config.ts.
  • Templates:
    • Added e2e/app.spec.ts to each.
    • Code is formatted by Prettier, with imports grouped and ordered and import type for type-only imports.
    • Added a return type to HomePage.refresh in the list template.
  • Each ionic.starter.json test script now runs lint, build, unit tests, then Playwright e2e.

Notes

@ShaneK ShaneK left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 🚀

@brandyscarney
brandyscarney force-pushed the chore/angular-standalone-tooling branch from 78065f6 to 55ee2f3 Compare October 27, 2026 15:26
@brandyscarney
brandyscarney force-pushed the chore/angular-standalone-tooling branch from 55ee2f3 to 5d692ec Compare October 27, 2026 19:27
@brandyscarney
brandyscarney enabled auto-merge (squash) October 27, 2026 19:39
@brandyscarney
brandyscarney merged commit a67ef31 into main Oct 27, 2026
30 checks passed
@brandyscarney
brandyscarney deleted the chore/angular-standalone-tooling branch October 27, 2026 19:40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants