Basic initialisation test for Editor.js (#1410)
* Initial commit * Fixed test.html file * Create editor instance in the test * Assert paragraph data in editor instance * Moving cypress folder to test folder * Minor Fixes * Removed config test for now * Fixed example.html * Fixed editor.js dist path * Minor Fixes * Stored Host in a const * Add nodemon and Fix commands * Add and configure cypress eslint plugin * Updated Tests according to best practices * Minor FIxes * Minor FIxes * adjust eslint and ts * Update .eslintrc * improve config * debug tests * fix tests * Fix declarations * descrease debounce * rm timeout * Update CHANGELOG.md * Update CHANGELOG.md Co-authored-by: Peter Savchenko <specc.dev@gmail.com> Co-authored-by: George Berezhnoy <gohabereg@gmail.com>
This commit is contained in:
Mihir Rane
GitHub
parent
f440a60ead
commit
585e01b06c
|
|
@ -7,6 +7,7 @@
|
|||
* Temporary suppress some errors. We need to fix them partially in next patches
|
||||
*/
|
||||
"import/no-duplicates": ["warn"],
|
||||
"@typescript-eslint/triple-slash-reference": ["off"]
|
||||
},
|
||||
"settings": {
|
||||
"jsdoc": {
|
||||
|
|
|
|||
|
|
@ -9,3 +9,6 @@ node_modules/*
|
|||
|
||||
npm-debug.log
|
||||
yarn-error.log
|
||||
|
||||
test/cypress/screenshots
|
||||
test/cypress/videos
|
||||
|
|
|
|||
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"projectId": "tivr7e",
|
||||
"env": {
|
||||
},
|
||||
"fixturesFolder": "test/cypress/fixtures",
|
||||
"integrationFolder": "test/cypress/tests",
|
||||
"pluginsFile": "test/cypress/plugins/index.ts",
|
||||
"screenshotsFolder": "test/cypress/screenshots",
|
||||
"videosFolder": "test/cypress/videos",
|
||||
"supportFile": "test/cypress/support/index.ts"
|
||||
}
|
||||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
### 2.19.1
|
||||
|
||||
- `Improvements` - The [Cypress](https://www.cypress.io) was integrated as the end-to-end testing framework
|
||||
- `Fix` - The problem with destroy() method [#1380](https://github.com/codex-team/editor.js/issues/1380).
|
||||
- `Fix` - add getter keyword to `block.mergeable` method [#1415](https://github.com/codex-team/editor.js/issues/1415).
|
||||
- `Fix` — Fix problem with entering to Editor.js by Tab key [#1393](https://github.com/codex-team/editor.js/issues/1393)
|
||||
|
|
|
|||
|
|
@ -16,13 +16,15 @@
|
|||
"build:win": "rimraf dist && yarn svg:win && yarn build:prod",
|
||||
"build:dev": "webpack --mode development --progress --display-error-details --display-entrypoints --watch",
|
||||
"build:prod": "webpack --mode production",
|
||||
"lint": "eslint src/ --ext .ts",
|
||||
"lint": "eslint src/ --ext .ts && yarn lint:tests",
|
||||
"lint:errors": "eslint src/ --ext .ts --quiet",
|
||||
"lint:fix": "eslint src/ --ext .ts --fix",
|
||||
"lint:tests": "eslint test/ --ext .ts",
|
||||
"svg:win": "if not exist dist md dist && yarn svg",
|
||||
"svg": "svg-sprite-generate -d src/assets/ -o dist/sprite.svg",
|
||||
"pull_tools": "git submodule update --init --recursive",
|
||||
"checkout_tools": "git submodule foreach git pull origin master"
|
||||
"checkout_tools": "git submodule foreach git pull origin master",
|
||||
"test:e2e": "cypress open"
|
||||
},
|
||||
"author": "CodeX",
|
||||
"license": "Apache-2.0",
|
||||
|
|
@ -46,9 +48,11 @@
|
|||
"core-js": "3.6.5",
|
||||
"css-loader": "^3.5.3",
|
||||
"cssnano": "^4.1.10",
|
||||
"cypress": "^5.5.0",
|
||||
"eslint": "^6.8.0",
|
||||
"eslint-config-codex": "^1.3.3",
|
||||
"eslint-loader": "^4.0.2",
|
||||
"eslint-plugin-cypress": "^2.11.2",
|
||||
"extract-text-webpack-plugin": "^3.0.2",
|
||||
"html-janitor": "^2.0.4",
|
||||
"license-webpack-plugin": "^2.1.4",
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"plugins": [
|
||||
"cypress"
|
||||
],
|
||||
"env": {
|
||||
"cypress/globals": true
|
||||
},
|
||||
"extends": [
|
||||
"plugin:cypress/recommended"
|
||||
],
|
||||
"rules": {
|
||||
"cypress/require-data-selectors": 2
|
||||
},
|
||||
"globals": {
|
||||
"EditorJS": true
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<body>
|
||||
<!-- Load Editor.js's Core -->
|
||||
<script src="./../../../dist/editor.js"></script>
|
||||
<h1>Editor.js test page</h1>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
/**
|
||||
* This file contains connection of Cypres plugins
|
||||
*/
|
||||
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
||||
export default function(on, config): void {}
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
/**
|
||||
* This file contains custom commands for Cypress.
|
||||
* Also it can override the existing commands.
|
||||
*
|
||||
* --------------------------------------------------
|
||||
*/
|
||||
|
||||
import type { EditorConfig } from './../../../types/index';
|
||||
import type EditorJS from '../../../types/index';
|
||||
import Chainable = Cypress.Chainable;
|
||||
|
||||
/**
|
||||
* Create a wrapper and initialize the new instance of editor.js
|
||||
* Then return the instance
|
||||
*
|
||||
* @param editorConfig - config to pass to the editor
|
||||
* @returns EditorJS - created instance
|
||||
*/
|
||||
Cypress.Commands.add('createEditor', (editorConfig: EditorConfig = {}): Chainable<EditorJS> => {
|
||||
return cy.window()
|
||||
.then((window) => {
|
||||
return new Promise((resolve: (instance: EditorJS) => void) => {
|
||||
const editorContainer = window.document.createElement('div');
|
||||
|
||||
editorContainer.setAttribute('id', 'editorjs');
|
||||
editorContainer.dataset.cy = 'editorjs';
|
||||
editorContainer.style.border = '1px dotted #388AE5';
|
||||
|
||||
window.document.body.appendChild(editorContainer);
|
||||
|
||||
const editorInstance: EditorJS = new window.EditorJS(editorConfig);
|
||||
|
||||
editorInstance.isReady.then(() => {
|
||||
resolve(editorInstance);
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
// in cypress/support/index.d.ts
|
||||
// load type definitions that come with Cypress module
|
||||
/// <reference types="cypress" />
|
||||
|
||||
import type { EditorConfig } from './../../../types/index';
|
||||
import type EditorJS from '../../../types/index'
|
||||
|
||||
declare global {
|
||||
namespace Cypress {
|
||||
interface Chainable<Subject = any> {
|
||||
/**
|
||||
* Custom command to select DOM element by data-cy attribute.
|
||||
* @param editorConfig - config to pass to the editor
|
||||
* @example cy.createEditor({})
|
||||
*/
|
||||
createEditor(editorConfig: EditorConfig): Chainable<EditorJS>
|
||||
}
|
||||
|
||||
interface ApplicationWindow {
|
||||
EditorJS: typeof EditorJS
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
/**
|
||||
* This file is processed and
|
||||
* loaded automatically before the test files.
|
||||
*
|
||||
* This is a great place to put global configuration and
|
||||
* behavior that modifies Cypress.
|
||||
*/
|
||||
|
||||
/**
|
||||
* File with the helpful commands
|
||||
*/
|
||||
import './commands';
|
||||
|
||||
/**
|
||||
* Before-each hook for the cypress tests
|
||||
*/
|
||||
beforeEach((): void => {
|
||||
cy.visit('test/cypress/fixtures/test.html');
|
||||
});
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
// eslint-disable-next-line spaced-comment
|
||||
/// <reference path="../support/index.d.ts" />
|
||||
|
||||
describe('Editor basic initialization', () => {
|
||||
describe('Zero-config initialization', () => {
|
||||
/**
|
||||
* In this test suite we use zero (omitted) configuration
|
||||
*/
|
||||
const editorConfig = {};
|
||||
|
||||
beforeEach(() => {
|
||||
if (this.editorInstance) {
|
||||
this.editorInstance.destroy();
|
||||
} else {
|
||||
cy.createEditor(editorConfig).as('editorInstance');
|
||||
}
|
||||
});
|
||||
|
||||
it('should create a visible UI', () => {
|
||||
cy.window().then((window) => {
|
||||
/**
|
||||
* Assert if created instance is visible or not.
|
||||
*/
|
||||
cy.get('[data-cy=editorjs]')
|
||||
.get('div.codex-editor')
|
||||
.should('be.visible');
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "es2017",
|
||||
"lib": ["es2017", "dom"],
|
||||
"types": ["cypress"]
|
||||
},
|
||||
"include": [
|
||||
"**/*.ts"
|
||||
]
|
||||
}
|
||||
|
|
@ -20,7 +20,8 @@
|
|||
"no-string-literal": false,
|
||||
"no-empty": false,
|
||||
"no-namespace": false,
|
||||
"variable-name": [true, "allow-leading-underscore", "allow-pascal-case"]
|
||||
"variable-name": [true, "allow-leading-underscore", "allow-pascal-case"],
|
||||
"no-reference": false
|
||||
},
|
||||
"globals": {
|
||||
"require": true
|
||||
|
|
|
|||
Loading…
Reference in New Issue