Skip to content

Project modernization#269

Draft
feimosi wants to merge 11 commits intodevfrom
baguetteBox-next
Draft

Project modernization#269
feimosi wants to merge 11 commits intodevfrom
baguetteBox-next

Conversation

@feimosi
Copy link
Copy Markdown
Owner

@feimosi feimosi commented Mar 9, 2026

No description provided.

feimosi added 9 commits March 9, 2026 21:16
Capture the approved phased migration approach, compatibility posture, and commit-by-phase workflow before implementation begins.

Made-with: Cursor
Create a self-contained browser smoke suite around the published dist assets so later migration phases can validate key lightbox flows without relying on generated demo files, including a small pre-CSS screenshot baseline with documented update steps.

Made-with: Cursor
Run the Playwright smoke and snapshot suite on pushes and pull requests, and allow the test config to resolve Chrome consistently in both local and CI environments.

Made-with: Cursor
Replace the deprecated Gulp 3 task orchestration with Gulp 4 series/parallel tasks, remove the stale node-sass rebuild path, and swap in a compatible CSS minifier while preserving the existing build outputs and test flow.

Made-with: Cursor
Replace the legacy gulp-eslint path with standalone ESLint so the project can lint modern JavaScript cleanly without constraining the later TypeScript migration.

Made-with: Cursor
Flatten the single library stylesheet into plain CSS, remove the Sass-only build path and dependencies, and keep the generated dist assets aligned with the existing visual and behavioral baseline.

Made-with: Cursor
Keep the published build flow on Gulp by transpiling the new .ts source before dist generation, and add an explicit typecheck step so future changes cannot reintroduce unchecked runtime typings.

Made-with: Cursor
Copy link
Copy Markdown

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

Modernizes the project tooling and safety net by migrating the source to strict TypeScript, replacing Sass with plain CSS, updating the Gulp build pipeline, and adding Playwright-based UI smoke/snapshot tests with a GitHub Actions workflow to run them.

Changes:

  • Add strict TypeScript configuration and migrate the core library source to src/baguetteBox.ts with explicit typings.
  • Replace the Sass stylesheet with a plain CSS source file and keep dist/ artifacts updated.
  • Introduce Playwright smoke + snapshot UI tests (and CI workflow), plus modern ESLint flat config and updated npm scripts.

Reviewed changes

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

Show a summary per file
File Description
tsconfig.json Adds strict TS config for typechecking the source.
tsconfig.build.json Adds build TS config emitting compiled JS into an intermediate directory.
src/baguetteBox.ts Migrates library implementation to strict TypeScript with typed public API/options and refactors for safer DOM/event handling.
src/baguetteBox.scss Removes Sass source (migration to plain CSS).
src/baguetteBox.css Adds plain CSS source equivalent to the former Sass styling.
gulpfile.js Updates build pipeline for TS transpilation + CSS processing and Gulp 4+ task composition.
package.json Updates scripts/devDependencies for new lint/typecheck/UI-test workflow and removes Sass/node-sass legacy pieces.
eslint.config.js Adds ESLint flat config with scoped rules/ignores for configs/tests/generated artifacts.
playwright.config.js Adds Playwright runner config with local web server and snapshot path template.
tests/ui/smoke.spec.js Adds Playwright UI smoke tests with screenshot snapshots.
tests/fixtures/smoke.html Adds a deterministic HTML fixture to exercise the library in-browser.
tests/fixtures/assets/placeholder.svg Adds a stable placeholder asset used by the smoke fixture.
.github/workflows/ui-tests.yml Adds CI workflow running Playwright UI tests on macOS with Chrome.
.gitignore Ignores Playwright output and TS build intermediates; un-ignores test fixture assets.
README.md Updates project description and documents testing/development workflow.
CONTRIBUTING.md Updates contribution/release instructions to match the new scripts/tests.
.migration-plan.md Documents the migration plan/phases and acceptance criteria.
dist/baguetteBox.js Updates built distribution artifact to reflect TS/CSS/build changes.
dist/baguetteBox.min.js Updates minified distribution artifact accordingly.
dist/baguetteBox.css Updates built CSS artifact accordingly.
dist/baguetteBox.min.css Updates minified CSS artifact accordingly.
.eslintrc.js Removes legacy ESLint config (replaced by flat config).
Comments suppressed due to low confidence (1)

src/baguetteBox.ts:92

  • TypeScript will error here because exports and module are referenced but not declared anywhere (this repo’s tsconfig doesn’t include Node typings). Add declare const exports: unknown; and declare const module: { exports: unknown } | undefined; (or similar) near the existing declare const define so npm run typecheck/tsc --project tsconfig.build.json can succeed.

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

feimosi added 2 commits March 9, 2026 23:35
Make lint, typecheck, and build explicit CI steps while keeping npm test as the standard entrypoint by delegating it to the Playwright suite.

Made-with: Cursor
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