run example jest & vitest in next-yak CI

[jantimon]

fixes #56

• jest in example
• vitest in example

this is how yak works if no compiler is used:

styled.button`color:red`; is syntactic sugar for styled.button(["color:red"])

therefore styled.button`color:red`; will render <button className="">

right now there is a bug when using constants:

const color = "blue";
const Button = styled.button`color:${blue};`;

as this is is syntactic sugar for styled.button(["color:", ";"], "blue") which will render <button className="blue">

but I believe this PR is still okay for a first round and we should try to fix the issue above in a follow up e.g. with an early return in styled if the first arg is an array

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
next-yak-benchmark	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 14, 2024 6:18pm
yacijs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 14, 2024 6:18pm

[codspeed-hq]

CodSpeed Performance Report

Merging #124 will not alter performance

_{Comparing feature/jest-tests (d92f60b) with main (8eea888)}

Summary

✅ 2 untouched benchmarks

[coderabbitai]

Actionable comments posted: 0

Outside diff range, codebase verification and nitpick comments (1)

packages/example/package.json (1)

23-24: Potential Compatibility Issue with React Versions

The versions of react and react-dom have been updated to 18.3.1 across most packages. However, packages/docs/package.json uses latest for these dependencies, which could lead to compatibility issues. Please update packages/docs/package.json to use react and react-dom version 18.3.1 for consistency.

• packages/docs/package.json: Update react and react-dom to 18.3.1.

Analysis chain

LGTM! Verify compatibility of new React versions.

The versions of react and react-dom have been updated to 18.3.1. Ensure that these new versions are compatible with the rest of the project dependencies and that there are no breaking changes.

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify compatibility of new React versions with the project dependencies.

# Test: Search for React versions in all package.json files. Expect: All should be compatible with `18.3.1`.
rg --type json -A 5 $'"react":'

Length of output: 2017

Review details

Configuration used: CodeRabbit UI
Review profile: CHILL

Commits

Files that changed from the base of the PR and between fc03370 and da8eb54.

Files ignored due to path filters (3)

• packages/example/app/__tests__/__snapshots__/Clock.test.tsx.snap is excluded by !**/*.snap
• packages/example/app/__tests__/__snapshots__/ClockHands.test.tsx.snap is excluded by !**/*.snap
• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

Files selected for processing (8)

• package.json (1 hunks)
• packages/benchmark/package.json (1 hunks)
• packages/example/app/tests/Clock.test.tsx (1 hunks)
• packages/example/app/tests/ClockHands.test.tsx (1 hunks)
• packages/example/jest.config.js (1 hunks)
• packages/example/package.json (1 hunks)
• packages/next-yak/package.json (1 hunks)
• packages/playground/package.json (1 hunks)

Files skipped from review due to trivial changes (7)

• package.json
• packages/benchmark/package.json
• packages/example/app/tests/Clock.test.tsx
• packages/example/app/tests/ClockHands.test.tsx
• packages/example/jest.config.js
• packages/next-yak/package.json
• packages/playground/package.json

Additional comments not posted (2)

packages/example/package.json (2)

30-35: LGTM! Verify compatibility of new devDependencies.

New devDependencies for Vitest and Jest have been added. Ensure that these new dependencies are correctly configured and compatible with the project setup.

Verification successful

To ensure the compatibility of the new devDependencies, we need to verify the presence of configuration files for Jest and Vitest and check for any potential conflicts with other dependencies.

---

LGTM! Verify compatibility of new devDependencies.

New devDependencies for Vitest and Jest have been added. Configuration files for both Jest (jest.config.js) and Vitest (vitest.config.ts) are present, and there are no conflicting dependencies found. Ensure that these new dependencies are correctly configured and compatible with the project setup.

• jest.config.js in packages/example/
• vitest.config.ts in packages/next-yak/ and packages/webpack-tests/

Scripts executed

The following scripts were executed for the analysis:

Script:

#!/bin/bash
# Description: Verify compatibility of new devDependencies with the project setup.

# Test: Search for devDependencies in all package.json files. Expect: All should be compatible with the new additions.
rg --type json -A 5 $'"devDependencies":'

Length of output: 2064

---

Script:

#!/bin/bash
# Check for the presence of Jest and Vitest configuration files
fd -e js -e ts -e json -e mjs -e cjs --regex 'jest\.config|vitest\.config'

# Check for potential conflicts in devDependencies across all package.json files
rg --type json '"jest":' -A 5
rg --type json '"vitest":' -A 5

Length of output: 1439

---

12-14: LGTM! Ensure CI configuration compatibility.

The test scripts have been updated to integrate both Vitest and Jest. Ensure that the CI pipeline is correctly configured to handle these scripts.