@dream2023/cypress-solidjs
TypeScript icon, indicating that this package has built-in type declarations

0.1.3 • Public • Published

@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

license

This project is licensed under the terms of the MIT license.

Package Sidebar

Install

npm i @dream2023/cypress-solidjs

Weekly Downloads

16

Version

0.1.3

License

MIT

Unpacked Size

11.2 kB

Total Files

8

Last publish

Collaborators

  • dream2023