mirror of
https://github.com/projectstorm/react-diagrams.git
synced 2025-08-14 00:29:32 +08:00
get rid of puppeteer
This commit is contained in:
Dylan Vorster
22
.github/workflows/test.yml
vendored
22
.github/workflows/test.yml
vendored
@ -2,28 +2,6 @@ name: Build and Test
|
||||
on:
|
||||
pull_request:
|
||||
jobs:
|
||||
e2e:
|
||||
name: E2E Tests
|
||||
runs-on: ubuntu-latest
|
||||
container: browserless/chrome
|
||||
env:
|
||||
CI: true
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
|
||||
- name: Install PNPM
|
||||
uses: pnpm/action-setup@v2
|
||||
with:
|
||||
version: latest
|
||||
|
||||
- name: Install Dependencies
|
||||
run: pnpm install
|
||||
|
||||
- name: Build
|
||||
run: pnpm build
|
||||
|
||||
- name: Test
|
||||
run: pnpm test
|
||||
build:
|
||||
name: Build
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
@ -1,5 +0,0 @@
|
||||
module.exports = {
|
||||
launch: {
|
||||
browserWSEndpoint: 'ws://localhost:3000'
|
||||
}
|
||||
};
|
||||
@ -1,9 +0,0 @@
|
||||
const path = require('path');
|
||||
module.exports = {
|
||||
preset: 'jest-puppeteer',
|
||||
transform: {
|
||||
'^.+\\.tsx?$': 'ts-jest'
|
||||
},
|
||||
roots: [path.join(__dirname, 'tests-e2e')],
|
||||
testMatch: ['**/*.test.{ts,tsx}']
|
||||
};
|
||||
13
diagrams-demo-gallery/package-lock.json
generated
13
diagrams-demo-gallery/package-lock.json
generated
@ -1,13 +0,0 @@
|
||||
{
|
||||
"name": "@projectstorm/react-diagrams-gallery",
|
||||
"version": "6.7.4",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
"gsap": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/gsap/-/gsap-3.0.1.tgz",
|
||||
"integrity": "sha512-9nzEBF7Ss9Ogyw6oEOXZxxVYH8WNRA/nHmIp3DrPOTKmlLxX9MN2ovSoH9TApA+rucBgp9veCedujp5oSQRvZw=="
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -10,9 +10,7 @@
|
||||
},
|
||||
"scripts": {
|
||||
"start": "./node_modules/.bin/start-storybook",
|
||||
"storybook:build": "./node_modules/.bin/build-storybook -c .storybook -o .out",
|
||||
"test:run": "../node_modules/.bin/jest --no-cache",
|
||||
"test": "pnpm storybook:build && pnpm test:run"
|
||||
"storybook:build": "./node_modules/.bin/build-storybook -c .storybook -o .out"
|
||||
},
|
||||
"keywords": [
|
||||
"web",
|
||||
|
||||
@ -1,28 +0,0 @@
|
||||
import { ElementHandle } from 'puppeteer';
|
||||
|
||||
export abstract class E2EBase {
|
||||
name: string;
|
||||
|
||||
constructor(name: string) {
|
||||
this.name = name;
|
||||
}
|
||||
|
||||
async getSelector(): Promise<any> {
|
||||
return page;
|
||||
}
|
||||
|
||||
async getElement(): Promise<ElementHandle> {
|
||||
if (!(await this.getSelector())) {
|
||||
return null;
|
||||
}
|
||||
return (await this.getSelector()).$(this.selector());
|
||||
}
|
||||
|
||||
async waitForElement(): Promise<ElementHandle | null> {
|
||||
return (await this.getSelector()).waitForSelector(this.selector(), {
|
||||
timeout: 1000
|
||||
});
|
||||
}
|
||||
|
||||
protected abstract selector(): string;
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
import { E2EBase } from './E2EBase';
|
||||
|
||||
export class E2ELink extends E2EBase {
|
||||
isID: boolean;
|
||||
|
||||
async select(): Promise<any> {
|
||||
const point = await page.evaluate((id) => {
|
||||
const path = document.querySelector(id) as SVGPathElement;
|
||||
const rect = path.getClientRects().item(0);
|
||||
return {
|
||||
x: rect.x + rect.width / 2,
|
||||
y: rect.y
|
||||
};
|
||||
}, this.selector());
|
||||
await page.keyboard.down('Shift');
|
||||
await page.mouse.move(point.x, point.y);
|
||||
await page.mouse.down();
|
||||
await page.keyboard.up('Shift');
|
||||
}
|
||||
|
||||
protected selector(): string {
|
||||
if (this.isID) {
|
||||
return `[data-linkid="${this.name}"] path`;
|
||||
}
|
||||
return `[data-default-link-test="${this.name}"] path`;
|
||||
}
|
||||
}
|
||||
@ -1,12 +0,0 @@
|
||||
import { E2EBase } from './E2EBase';
|
||||
import { E2EPort } from './E2EPort';
|
||||
|
||||
export class E2ENode extends E2EBase {
|
||||
async port(id: string): Promise<E2EPort> {
|
||||
return new E2EPort(id, this);
|
||||
}
|
||||
|
||||
selector(): string {
|
||||
return `[data-default-node-name="${this.name}"]`;
|
||||
}
|
||||
}
|
||||
@ -1,82 +0,0 @@
|
||||
import * as _ from 'lodash';
|
||||
import { E2EBase } from './E2EBase';
|
||||
import { E2ENode } from './E2ENode';
|
||||
import { E2ELink } from './E2ELink';
|
||||
|
||||
export class E2EPort extends E2EBase {
|
||||
parent: E2ENode;
|
||||
|
||||
constructor(name: string, parent: E2ENode) {
|
||||
super(name);
|
||||
this.parent = parent;
|
||||
}
|
||||
|
||||
async getLinks(): Promise<E2ELink[]> {
|
||||
const attribute = await page.evaluate((id) => {
|
||||
return document.querySelector(id).getAttribute('data-links');
|
||||
}, this.selector());
|
||||
if (attribute.trim() === '') {
|
||||
return [];
|
||||
}
|
||||
|
||||
return _.map(attribute.split(','), (id) => {
|
||||
const e = new E2ELink(id);
|
||||
e.isID = true;
|
||||
return e;
|
||||
});
|
||||
}
|
||||
|
||||
async link(port: E2EPort): Promise<E2ELink> {
|
||||
let currentLinks = _.map(await this.getLinks(), 'name');
|
||||
|
||||
let bounds = await (await this.getElement()).boundingBox();
|
||||
|
||||
// click on this port
|
||||
page.mouse.move(bounds.x, bounds.y);
|
||||
page.mouse.down();
|
||||
//
|
||||
let bounds2 = await (await port.getElement()).boundingBox();
|
||||
|
||||
// drag to other port
|
||||
page.mouse.move(bounds2.x, bounds2.y);
|
||||
page.mouse.up();
|
||||
|
||||
let newLinks = _.map(await this.getLinks(), 'name');
|
||||
|
||||
const s = new E2ELink(_.difference(newLinks, currentLinks)[0]);
|
||||
s.isID = true;
|
||||
return s;
|
||||
}
|
||||
|
||||
async linkToPoint(x: number, y: number): Promise<E2ELink> {
|
||||
let currentLinks = _.map(await this.getLinks(), 'id');
|
||||
|
||||
let bounds = await (await this.getElement()).boundingBox();
|
||||
|
||||
// click on this port
|
||||
page.mouse.move(bounds.x, bounds.y);
|
||||
page.mouse.down();
|
||||
|
||||
// drag to point
|
||||
page.mouse.move(x, y);
|
||||
page.mouse.up();
|
||||
|
||||
let newLinks = _.map(await this.getLinks(), 'id');
|
||||
|
||||
const link = _.difference(newLinks, currentLinks)[0];
|
||||
if (!link) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// get the parent to get the link
|
||||
return new E2ELink(link);
|
||||
}
|
||||
|
||||
async getSelector(): Promise<any> {
|
||||
return (await this.parent.getElement()) as any;
|
||||
}
|
||||
|
||||
protected selector(): string {
|
||||
return `${this.parent.selector()} .port[data-name="${this.name}"]`;
|
||||
}
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
import 'jest';
|
||||
import { E2ENode } from './helpers/E2ENode';
|
||||
|
||||
describe('simple flow test', () => {
|
||||
beforeEach(async () => {
|
||||
await page.goto(`file://${__dirname}/../.out/iframe.html?path=/story/simple-usage--simple-flow-example`);
|
||||
});
|
||||
|
||||
it('drag link to port adds a link', async () => {
|
||||
// create a new link
|
||||
let node1 = new E2ENode('Node 3');
|
||||
let node2 = new E2ENode('Node 2');
|
||||
|
||||
let port1 = await node1.port('Out');
|
||||
let port2 = await node2.port('In');
|
||||
|
||||
let newlink = await port1.link(port2);
|
||||
await expect(await newlink.waitForElement()).toBeTruthy();
|
||||
});
|
||||
|
||||
it('drag link to node does not add a link', async () => {
|
||||
// create a new link
|
||||
let node1 = new E2ENode('Node 3');
|
||||
let node2 = new E2ENode('Node 2');
|
||||
|
||||
let port1 = await node1.port('Out');
|
||||
|
||||
let node2Bounds = await (await node2.waitForElement()).boundingBox();
|
||||
let newlink = await port1.linkToPoint(node2Bounds.x, node2Bounds.y);
|
||||
|
||||
await expect(newlink).toBeFalsy();
|
||||
});
|
||||
});
|
||||
@ -1,31 +0,0 @@
|
||||
import 'jest';
|
||||
import { E2ELink } from './helpers/E2ELink';
|
||||
import { E2ENode } from './helpers/E2ENode';
|
||||
|
||||
describe('simple test', () => {
|
||||
beforeAll(async () => {
|
||||
await page.goto(`file://${__dirname}/../.out/iframe.html?path=/story/simple-usage--demo-simple`);
|
||||
});
|
||||
|
||||
it('should delete a link and create a new one', async () => {
|
||||
// get the existing link
|
||||
let link = new E2ELink('Test');
|
||||
await expect(await link.waitForElement()).toBeTruthy();
|
||||
|
||||
// remove it
|
||||
await link.select();
|
||||
await page.keyboard.press('Delete');
|
||||
|
||||
await expect(await link.getElement()).toBeFalsy();
|
||||
|
||||
// create a new link
|
||||
let node1 = new E2ENode('Node 1');
|
||||
let node2 = new E2ENode('Node 2');
|
||||
|
||||
let port1 = await node1.port('Out');
|
||||
let port2 = await node2.port('In');
|
||||
|
||||
let newlink = await port1.link(port2);
|
||||
await expect(await newlink.waitForElement()).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -30,16 +30,11 @@
|
||||
"devDependencies": {
|
||||
"@changesets/cli": "^2.26.0",
|
||||
"@types/jest": "^29.2.6",
|
||||
"@types/jest-environment-puppeteer": "^5.0.3",
|
||||
"@types/node": "^18.11.18",
|
||||
"@types/puppeteer": "^5.4.7",
|
||||
"jest": "^29.3.1",
|
||||
"jest-cli": "^29.3.1",
|
||||
"jest-puppeteer": "^6.2",
|
||||
"prettier": "^2.8.3",
|
||||
"puppeteer": "19.6.0",
|
||||
"rimraf": "^4.1.1",
|
||||
"react-test-renderer": "^18.2.0",
|
||||
"source-map-loader": "^4.0.1",
|
||||
"terser-webpack-plugin": "^5.3.6",
|
||||
"ts-jest": "^29.0.5",
|
||||
|
||||
Reference in New Issue
Block a user