Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Replace vanilla-ts test app with Vue + vue-router to provide isolated fixture pages for each test scenario, giving more control over test complexity and enabling Vue SFC testing. Key changes: - Scaffold vue-ts instead of vanilla-ts Vite project - Install vue-router alongside styleframe - Create fixture pages: /selectors (h1 test), /utilities (utility class tests), / (home with links) - Use hash-based routing for vite preview compatibility - Update Playwright tests to navigate to specific fixture routes - Update vite config assertion for both vue and styleframe plugins This allows future tests to be added as new fixture pages without polluting the app structure.
- Add fixture vite.config.ts with content patterns to enable the scanner for detecting utility class usage in Vue SFC templates - Fix utility class names: _bg → _background-color, _text → _text-color - Fix spacing assertions: sm = 12px (.75rem), not 8px - Fix color assertions: use oklch color space (toContain match) - Fix vite config assertion: magicast places new plugin last with trailing comma - Use npx vite build directly (skip vue-tsc type checking)
Add setup/update scripts so developers can iterate on fixtures and tests without re-running the full pipeline each time: - setup: One-time setup of .app/ with the full project - update: Re-copy fixtures and rebuild (fast iteration) - test:e2e: Now defaults to .app/ when PROJECT_DIR is not set Also add README.md documenting the pipeline, dev workflow, and how to add new test fixtures.
alexgrozav
force-pushed
the
alexgrozav/e2e-vue-fixtures
branch
from
08dabd5 to
1cd510b
Compare
The fixture files import vue, vue-router, and @vitejs/plugin-vue which are only available at runtime in the scaffolded project, not in the integration test package itself.
Codecov Report❌ Patch coverage is 📢 Thoughts on this report? Let us know! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request overhauls the integration testing setup for Styleframe, transforming it from a minimal TypeScript/Vite app into a full Vue + TypeScript application with routing and dedicated pages for selector and utility tests. The new structure enables more realistic end-to-end tests, adds scripts for local development and CI, and updates test expectations to match the new CSS color format. Key changes are grouped below:
Integration App Migration to Vue + Routing
HomePage.vue,SelectorsPage.vue,UtilitiesPage.vue), and updated the app entry point and router setup. ([[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-7a9390490efcc9986a88df87defb6bcc0964761c864cd43d3277b95446ef5ae9R1-R3),[[2]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-565bc7476f8c869247abb8e8cbd5013a5af3676e8e3558975a14e8e90fd08972R1-R6),[[3]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-ebf6a321f75327d848817ecebc1424b607c6c25b53364416864487c69176a21aR1-R7),[[4]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-9340fc05bdcb3f01fa3e25d63c2b079816d3dfe4b80cfa985755d065b96b6b38R1-R3),[[5]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-160eeb4b311f24fc953fd15291621a187b999792e6a9d2ea9a380403651ac51dR1-R7),[[6]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-20af30a9c6fbc444cb3a1e026fef90e16d7a911e93d8c2d912ade58d23a3a618R1-R13))vue-routerinstallation. ([[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-378281f1566ebcd328a189952f8896d4f938085f586072e928cd19d163b625ceL69-R69),[[2]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-378281f1566ebcd328a189952f8896d4f938085f586072e928cd19d163b625ceL110-R116),[[3]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-378281f1566ebcd328a189952f8896d4f938085f586072e928cd19d163b625ceL141-R154))Testing Pipeline & Scripts
setupandupdatescripts for local development, and refactored the pipeline to support iterative fixture/test updates. ([[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-84642e50becdbd10f9b622a4515de218d694fa30751f0ce5e658d2581bdd2568R17-R18),[[2]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-50970f261a19cd9a669fe59f74e1243f109b90f708a057c45a931bf76e71659dR1-R70),[[3]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-872022935723307df6f23c146e0096aafb97adb3c8710000f75943d92315cac0R1-R30)).gitignoreto exclude the new.app/integration app directory. ([testing/integration/.gitignoreR26-R28](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-0b163bd04cce55d4e917efe18858e48b1d2c833b751d1de7595a41f33956f397R26-R28))README.mdexplaining the integration test workflow and directory structure. ([testing/integration/README.mdR1-R88](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-9d5de11c30b0747b3d8e63bcb3efd1d032e96c92ff66b4b678f285b3e4345313R1-R88))Playwright & Test Configuration
.app/by default and improved project directory handling. ([[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-2d4d11beac2620c03a88e919dfe0ad1d1824e8d5edb6e425aa956e0dc0222dddR1-R5), [2][[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-e7c0d9788fe3acc09cc5687d0884d5689aab90afe765fa2c56113a9976c5afebL4-R4), [2] [3] [4] [5]Fixture & Build Improvements
[testing/integration/src/fixtures/vite.config.tsR1-R12](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-30c6dd8b38532800ed7a2c0599ee597d97958e773e4e502dafcc791e8c43d307R1-R12))[[1]](https://github.com/styleframe-dev/styleframe/pull/116/files#diff-b88d02ebd0bdfd89b3a7bb96502cd2f6e74a3e29568b16a3a00e7770394a4834L1-R6), [2]These changes significantly improve the realism, maintainability, and flexibility of integration testing for Styleframe.