@dream2023/cypress-solidjs
v0.1.3
Published
Browser-based Component Testing for SolidJS with Cypress.io 🧡
Downloads
65
Maintainers
Readme
@dream2023/cypress-solidjs
Mount SolidJS components in the open source Cypress.io test runner v10.7.0+
Install
- Requires SolidJS >= 1
- Requires Cypress v10.7.0 or later
- Requires Node version 12 or above
npm install --save-dev @dream2023/cypress-solidjs
Usage
// cypress.config.ts
import { defineConfig } from 'cypress'
export default defineConfig({
component: {
devServer: {
bundler: 'vite',
} as any,
},
})
Run
Open cypress test runner
npx cypress open --component
If you need to run test in CI
npx cypress run --component
For more information, please check the official docs for running Cypress and for component testing.
Example
import { mount, runHook, runAsyncHook } from '@dream2023/cypress-solidjs'
const HelloWorld = () => <p>Hello World!</p>;
const useCounter = (): { count: Accessor<number>, inc: () => void } => {
const [count, setCount] = createSignal<number>(0)
const inc = () => {
setCount(count => count + 1)
}
return { count, inc }
}
const useDelay = (time: number) => {
const [done, setDone] = createSignal(false);
setTimeout(() => {
setDone(true)
}, time)
return done
}
describe('HelloWorld component', () => {
it('render component', () => {
mount(() => <HelloWorld />)
cy.contains('Hello World!')
})
it('hook', () => {
runHook(() => {
const { count, inc } = useCounter()
expect(count()).to.be.eq(0)
inc()
expect(count()).to.be.eq(1)
})
})
it('async hook', () => {
return runAsyncHook(async () => {
const time = 1000
const done = useDelay(time)
expect(done()).to.eq(false)
await new Promise((resolve) => {
setTimeout(() => {
resolve(undefined)
}, time)
})
expect(done()).to.eq(true)
})
})
})
Development
Run yarn build
to compile and sync packages to the cypress
cli package.
Run yarn cy:open
to open Cypress component testing against real-world examples.
Run yarn test
to execute headless Cypress tests.
License
This project is licensed under the terms of the MIT license.