cribbage-trainer

Summary

Two-player cribbage discard and play improvement tool.

Continuous deployment

Code in main is automatically built on git push and deployed to the GitHub Pages hosted Cribbage Trainer app site and Storybook site on build success via GitHub Action Workflow.

Local and Development Setup

Install

• Install the latest version of the version of Node.js specified in .nvmrc by hand, or if using nvm: nvm install
• Install third-party dependencies: npm install

Build and Run

• Build production version of app (optional): npm run build
• Serve up and navigate to the dev app server: npm start then open http://localhost:5173
• Serve up and navigate to the production preview app server: npm start:production-preview then open http://localhost:4173

Lint and Test

• npm run clean && npm run build && npm run lint && npm test && npm run playwright:install && npm run storybook:test && npm run docker-test-e2e (running build prior to lint as some TypeScript ESLint issues are only found by ESLint when a dist/ directory containing build output exists for some unknown reason.)

Develop

• Serve Storybook stories: npm run storybook
• Build a static version of the Storybook stories: npm build storybook

Handling visual regression test screenshot differences

When the Playwright e2e (end to end) fail due to screenshot differences, compare expected and actual screenshots via npx --no-install playwright show-report to determine if the changes are visually acceptable. If acceptable, to update the expected screenshots:

• remove out of date screenshots: rm tests-e2e/index.screenshots.spec.ts-snapshots/*.png , then
• generate the now expected browser screenshots: npm run docker-test-e2e.