Environment and Build tests

.github/workflows/react-to-web-component.yml

@@ -8,7 +8,7 @@ on:
         description: "The version segment to increment: major, minor, patch, or prerelease."
         required: true
       preId:
-        description: "Appended to the prerelease segment. (default: \"\")"
+        description: 'Appended to the prerelease segment. (default: "")'
 
 jobs:
   verify:

packages/legacy/package.json

@@ -36,7 +36,8 @@
     "depcheck": "depcheck .",
     "dev": "vite",
     "test": "vitest",
-    "test:ci": "vitest run",
+    "test:react18": "chmod +x ./test && ./test",
+    "test:ci": "npm run test:react18",
     "test:coverage": "vitest run --coverage",
     "clean": "rm -rf tsconfig.tsbuildinfo dist",
     "build": "vite build"

packages/legacy/test

@@ -0,0 +1,6 @@
+#!/bin/bash
+
+cd ../../tests/environments/react18
+node copyTest.js react-to-webcomponent legacy
+npm ci
+npm run test:ci

packages/react-to-web-component/package.json

@@ -35,8 +35,8 @@
     "prettier": "prettier --check vite.config.ts src",
     "depcheck": "depcheck .",
     "dev": "vite",
-    "test": "vitest",
-    "test:ci": "vitest run",
+    "test": "cd ../../tests && npm run test",
+    "test:ci": "cd ../../tests && npm run test:ci",
     "test:coverage": "vitest run --coverage",
     "clean": "rm -rf tsconfig.tsbuildinfo dist",
     "build": "vite build"
@@ -46,8 +46,7 @@
   },
   "devDependencies": {
     "@types/react": "^18.0.0",
-    "@types/react-dom": "^18.0.0",
-    "prop-types": "^15.8.1"
+    "@types/react-dom": "^18.0.0"
   },
   "peerDependencies": {
     "react": "^18.0.0",

tests/builds/builds.test.ts

@@ -2,7 +2,6 @@ import { test, expect, describe } from "vitest"
 import AppWCVite from "./vite/dist/index.js"
 import AppWCViteSwc from "./vite/dist-swc/index.js"
 import AppWebpack from "./webpack/build/index.js"
-import { CustomElementConstructor } from "../../types.js"
 
 function flushPromises() {
   return new Promise((resolve) => setImmediate(resolve))

tests/builds/vite/package.json

@@ -9,9 +9,9 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@r2wc/react-to-web-component": "^2.0.2",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-to-webcomponent": "file:../../../.."
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.28",

tests/builds/vite/src/main.tsx

@@ -1,4 +1,4 @@
-import r2wc from "react-to-webcomponent"
+import r2wc from "@r2wc/react-to-web-component"
 import App from "./App"
 
 const AppWC = r2wc(App, { props: ["text"] })

tests/builds/webpack/package.json

@@ -3,13 +3,13 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@r2wc/react-to-web-component": "^2.0.2",
     "@types/node": "^16.18.23",
     "@types/react": "^18.0.37",
     "@types/react-dom": "^18.0.11",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-scripts": "5.0.1",
-    "react-to-webcomponent": "file:../../../..",
     "typescript": "^4.9.5"
   },
   "scripts": {

tests/builds/webpack/src/index.tsx

@@ -1,4 +1,4 @@
-import r2wc from "react-to-webcomponent"
+import r2wc from "@r2wc/react-to-web-component"
 import App from "./App"
 
 const AppWC = r2wc(App, { props: ["text"] })

tests/buildtests

@@ -1,22 +1,19 @@
 #!/bin/bash
 
-cd src/tests/environments/react16
+cd environments/react16
 node copyTest.js
-npm i
-npm install --install-links ../../../..
-cd ../../../../
+npm ci
+cd ../../
 
-cd src/tests/environments/react17
+cd environments/react17
 node copyTest.js
-npm i
-npm install --install-links ../../../..
-cd ../../../../
+npm ci
+cd ../../
 
-cd src/tests/environments/react18
-node copyTest.js
-npm i
-npm install --install-links ../../../..
-cd ../../../../
+cd environments/react18
+node copyTest.js @r2wc/react-to-web-component
+npm ci
+cd ../../
 
 # cd src/tests/environments/preact10
 # npm i
@@ -25,15 +22,12 @@ cd ../../../../
 
 
 # builds
-cd src/tests/builds/vite
-npm i
-npm install --install-links ../../../..
+cd builds/vite
+npm ci
 npm run build
 node swcBuild.js
-cd ../../../../
+cd ../../
 
-cd src/tests/builds/webpack
-npm i
-npm install --install-links ../../../..
+cd builds/webpack
+npm ci
 npm run build
-cd ../../../../

tests/environments/react16/copyTest.js

@@ -1,14 +1,16 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 const fs = require("fs")
 
-const TEST_PATH = "../../react-to-webcomponent.test.jsx"
-const REACT16_TEST_PATH = "./react-to-webcomponent.test.jsx"
+const TEST_PATH = "../../react-to-web-component.tsx"
+const REACT16_TEST_PATH = "./react-to-web-component.test.tsx"
 
 // copy test file from tests folder to react16 folder
 fs.copyFileSync(TEST_PATH, REACT16_TEST_PATH)
 
-// edit react-to-webcomponent test file's reactToWebComponent and components imports
+// read test file
 const data = fs.readFileSync(REACT16_TEST_PATH, "utf8")
-const result = data.replace(/..\/legacy\/react-to-webcomponent/g, "react-to-webcomponent/render")
-const result2 = result.replace(/.\/components/g, "../../components.tsx")
+// add react-to-web-component import to top of file
+const result = `import r2wc from '@r2wc/react-to-web-component';\n${data}`
+// remove r2wc mock from test file
+const result2 = result.replace("const r2wc = vi.fn()", "")
 fs.writeFileSync(REACT16_TEST_PATH, result2, "utf8")