1
0
mirror of https://github.com/xuthus83/pigallery2.git synced 2024-11-03 21:04:03 +08:00

Adding basic cygress e2e tests

This commit is contained in:
Patrik J. Braun 2023-09-06 12:56:52 +02:00
parent 90a5480ff6
commit b34038c2a0
14 changed files with 1726 additions and 20 deletions

View File

@ -64,6 +64,10 @@ jobs:
MYSQL_PORT: ${{ job.services.mariadb.ports[3306] }} MYSQL_PORT: ${{ job.services.mariadb.ports[3306] }}
PORT: 35000 PORT: 35000
CI: true CI: true
- name: Cypress run
uses: cypress-io/github-action@v6
with:
start: npm run start-e2e-server
create-release: create-release:
runs-on: [ubuntu-latest] runs-on: [ubuntu-latest]

View File

@ -2,7 +2,8 @@
"$schema": "./node_modules/@angular/cli/lib/config/schema.json", "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"cli": { "cli": {
"schematicCollections": [ "schematicCollections": [
"@angular-eslint/schematics" "@angular-eslint/schematics",
"@schematics/angular"
] ]
}, },
"version": 1, "version": 1,

20
cypress.config.ts Normal file
View File

@ -0,0 +1,20 @@
import {defineConfig} from 'cypress';
export default defineConfig({
e2e: {
'baseUrl': 'http://localhost:8080',
experimentalStudio: true,
supportFile: 'cypress/support/e2e.ts',
specPattern:'cypress/e2e/**/*.cy.ts'
},
component: {
devServer: {
framework: 'angular',
bundler: 'webpack',
},
specPattern: '**/*.cy.ts'
}
});

33
cypress/e2e/login.cy.ts Normal file
View File

@ -0,0 +1,33 @@
describe('Login', () => {
it('Page opens', () => {
cy.visit('/');
cy.get('.card-body');
cy.get('.col-sm-12').contains('Login');
});
it('Login', () => {
cy.visit('/');
cy.get('.card-body');
cy.get('.col-sm-12').contains('Login');
/* ==== Generated with Cypress Studio ==== */
cy.get('#username').type('admin');
cy.get('#password').clear();
cy.get('#password').type('admin');
cy.intercept({
method: 'Get',
url: '/pgapi/gallery/content/',
}).as('getDir');
cy.get('.col-sm-12 > .btn').click();
/* ==== End Cypress Studio ==== */
cy.get('.mb-0 > :nth-child(1) > .nav-link').contains('Gallery');
cy.wait('@getDir').then((interception) => {
assert.isNotNull(interception.response.body, '1st API call has data');
});
});
it('Should fail', () => {
cy.visit('/');
cy.get('.does-not-exist', {timeout: 1});
});
});

View File

@ -0,0 +1,43 @@
// ***********************************************
// This example namespace declaration will help
// with Intellisense and code completion in your
// IDE or Text Editor.
// ***********************************************
// declare namespace Cypress {
// interface Chainable<Subject = any> {
// customCommand(param: any): typeof customCommand;
// }
// }
//
// function customCommand(param: any): void {
// console.warn(param);
// }
//
// NOTE: You can use it like so:
// Cypress.Commands.add('customCommand', customCommand);
//
// ***********************************************
// This example commands.js 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) => { ... })

View File

@ -0,0 +1,12 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Components App</title>
</head>
<body>
<div data-cy-root></div>
</body>
</html>

View File

@ -0,0 +1,39 @@
// ***********************************************************
// This example support/component.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')
import { mount } from 'cypress/angular'
// Augment the Cypress namespace to include type definitions for
// your custom command.
// Alternatively, can be defined in cypress/support/component.d.ts
// with a <reference path="./component" /> at the top of your spec.
declare global {
namespace Cypress {
interface Chainable {
mount: typeof mount
}
}
}
Cypress.Commands.add('mount', mount)
// Example use:
// cy.mount(MyComponent)

17
cypress/support/e2e.ts Normal file
View File

@ -0,0 +1,17 @@
// ***********************************************************
// 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
// ***********************************************************
// When a command from ./commands is ready to use, import with `import './commands'` syntax
// import './commands';

8
cypress/tsconfig.json Normal file
View File

@ -0,0 +1,8 @@
{
"extends": "../tsconfig.json",
"include": ["**/*.ts"],
"compilerOptions": {
"sourceMap": false,
"types": ["cypress"]
}
}

1541
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -23,7 +23,9 @@
"merge-new-translation": "gulp merge-new-translation", "merge-new-translation": "gulp merge-new-translation",
"generate-man": "gulp generate-man", "generate-man": "gulp generate-man",
"lint": "ng lint", "lint": "ng lint",
"ng-test": "ng test" "start-e2e-server": "node ./test/folder-reset test/e2e && node ./src/backend/index --config-path=test/e2e/config.json --Database-dbFolder=test/e2e --Server-port=8080 --Server-Log-level=debug",
"cypress:open": "cypress open",
"cypress:run": "cypress run"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
@ -110,6 +112,7 @@
"codelyzer": "6.0.2", "codelyzer": "6.0.2",
"core-js": "3.29.0", "core-js": "3.29.0",
"coveralls": "3.1.1", "coveralls": "3.1.1",
"cypress": "latest",
"deep-equal-in-any-order": "2.0.5", "deep-equal-in-any-order": "2.0.5",
"ejs-loader": "0.5.0", "ejs-loader": "0.5.0",
"eslint": "8.36.0", "eslint": "8.36.0",

View File

@ -12,7 +12,7 @@ declare const process: any;
const upTime = new Date().toISOString(); const upTime = new Date().toISOString();
// TODO: Refactor Config to be injectable globally. // TODO: Refactor Config to be injectable globally.
// This is a bad habit to let the Config know if its in a testing env. // This is a bad habit to let the Config know if its in a testing env.
const isTesting = ['afterEach', 'after', 'beforeEach', 'before', 'describe', 'it'] const isTesting = process.env['NODE_ENV'] == true || ['afterEach', 'after', 'beforeEach', 'before', 'describe', 'it']
.every((fn) => (global as any)[fn] instanceof Function); .every((fn) => (global as any)[fn] instanceof Function);
@ConfigClass<IConfigClass<TAGS> & ServerConfig>({ @ConfigClass<IConfigClass<TAGS> & ServerConfig>({

14
test/folder-reset.ts Normal file
View File

@ -0,0 +1,14 @@
import * as fs from 'fs';
declare const process: { argv: string[] };
const dir = process.argv[2];
if (fs.existsSync(dir)) {
console.log('deleting folder:' + dir);
fs.rmSync(dir, {recursive: true});
}
console.log('creating folder:' + dir);
fs.mkdirSync(dir);

View File

@ -24,5 +24,8 @@
"strictInjectionParameters": true, "strictInjectionParameters": true,
"strictInputAccessModifiers": true, "strictInputAccessModifiers": true,
"strictTemplates": true "strictTemplates": true
} },
"exclude": [
"cypress.config.ts"
]
} }