Skip to content

Commit

Permalink
feat(test): add cypress with e2e tests
Browse files Browse the repository at this point in the history
  • Loading branch information
matschik committed Mar 5, 2024
1 parent d2b82d1 commit 66ca79c
Show file tree
Hide file tree
Showing 10 changed files with 3,124 additions and 4,847 deletions.
12 changes: 12 additions & 0 deletions .github/workflows/e2e.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
name: End-to-end tests
on: push
jobs:
cypress-run:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v4
# Install npm dependencies, cache them correctly
# and run all Cypress tests
- name: Cypress run
uses: cypress-io/github-action@v6
16 changes: 16 additions & 0 deletions cypress.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { defineConfig } from "cypress";

export default defineConfig({
e2e: {
baseUrl: "http://localhost:5173",
setupNodeEvents(on, config) {
// implement node event listeners here
},
},
component: {
devServer: {
framework: "svelte",
bundler: "vite",
},
},
});
35 changes: 35 additions & 0 deletions cypress/e2e/initial.cy.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
/// <reference types="cypress" />
describe("Initial frameworks", () => {
it("initial frameworks from scratch", () => {
cy.visit("/");
cy.get("[data-framework-id-selected-list]").should(
"have.attr",
"data-framework-id-selected-list",
"react,svelte4"
);
});

it("initial frameworks from local storage", () => {
cy.visit("/", {
onBeforeLoad(win) {
win.localStorage.setItem("framework_display", '["vue3","svelte4"]');
},
});
cy.get("[data-framework-id-selected-list]").should(
"have.attr",
"data-framework-id-selected-list",
"vue3,svelte4"
);
});
});

describe("pages", () => {
it("compare page", () => {
cy.visit("/compare/vue2-vs-vue3");
cy.get("[data-framework-id-selected-list]").should(
"have.attr",
"data-framework-id-selected-list",
"vue2,vue3"
);
});
});
5 changes: 5 additions & 0 deletions cypress/fixtures/example.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
37 changes: 37 additions & 0 deletions cypress/support/commands.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
//
//
// -- This is a parent command --
// Cypress.Commands.add('login', (email, password) => { ... })
//
//
// -- This is a child command --
// Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
//
// declare global {
// namespace Cypress {
// interface Chainable {
// login(email: string, password: string): Chainable<void>
// drag(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// dismiss(subject: string, options?: Partial<TypeOptions>): Chainable<Element>
// visit(originalFn: CommandOriginalFn, url: string, options: Partial<VisitOptions>): Chainable<Element>
// }
// }
// }
20 changes: 20 additions & 0 deletions cypress/support/e2e.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
// ***********************************************************
// This example support/e2e.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************

// Import commands.js using ES2015 syntax:
import "./commands";

// Alternatively you can use CommonJS syntax:
// require('./commands')
12 changes: 9 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,15 @@
"format:check": "prettier --ignore-path .gitignore --plugin-search-dir=. . --check",
"build:content": "node scripts/generateContent.js",
"build:progress": "node scripts/generateReadMeProgress.js",
"prepare": "husky"
"prepare": "husky",
"cy:open-e2e": "cypress open --e2e --browser chrome",
"cy:open-unit": "cypress open --component --browser chrome",
"cy:run-e2e": "cypress run --e2e",
"cy:e2e": "start-server-and-test dev http-get://localhost:5173 cy:open-e2e"
},
"dependencies": {
"@lit/context": "^1.1.0",
"@veljs/svelte": "^0.1.11",
"classnames": "^2.5.1",
"eslint-plugin-svelte": "^2.35.1",
"heroiconsvelte": "^1.0.2",
"radix3": "^1.1.0"
},
Expand All @@ -35,6 +37,7 @@
"@babel/eslint-parser": "^7.23.10",
"@babel/plugin-proposal-decorators": "^7.24.0",
"@builder.io/qwik": "^1.4.5",
"@lit/context": "^1.1.0",
"@matschik/lz-string": "^0.0.2",
"@stefanprobst/remark-shiki": "^2.2.1",
"@sveltejs/vite-plugin-svelte": "^3.0.2",
Expand All @@ -46,13 +49,15 @@
"autoprefixer": "^10.4.18",
"chokidar": "^3.6.0",
"codesandbox": "^2.2.3",
"cypress": "^13.6.6",
"eslint": "^8.57.0",
"eslint-plugin-ember": "^12.0.2",
"eslint-plugin-lit": "^1.11.0",
"eslint-plugin-prettier": "^5.1.3",
"eslint-plugin-qwik": "^1.4.5",
"eslint-plugin-react": "^7.33.2",
"eslint-plugin-solid": "^0.13.1",
"eslint-plugin-svelte": "^2.35.1",
"eslint-plugin-vue": "^9.22.0",
"esm": "^3.2.25",
"eta": "^3.2.0",
Expand All @@ -75,6 +80,7 @@
"remark-rehype": "^11.1.0",
"shiki": "^0.14.7",
"solid-js": "^1.8.15",
"start-server-and-test": "^2.0.3",
"svelte": "^4.2.12",
"svelte-preprocess": "^5.1.3",
"tailwindcss": "^3.4.1",
Expand Down
Loading

0 comments on commit 66ca79c

Please sign in to comment.