Elgato_dark/idraw
1
0
Fork 0
mirror of https://github.com/idrawjs/idraw synced 2026-05-24 10:08:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: update e2e testing

Browse source
This commit is contained in:
chenshenhai 2021-06-14 08:46:39 +08:00
parent c96270133e
commit 4361a2812f
20 changed files with 188 additions and 108 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
__tests__/snapshot/core/examples/features/image.html.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 164 KiB

BIN
__tests__/snapshot/core/examples/features/rect.html.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 129 KiB

BIN
__tests__/snapshot/core/examples/features/svg.html.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 154 KiB

BIN
__tests__/snapshot/core/examples/features/text.html.jpg
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 177 KiB

BIN
__tests__/snapshot/core/examples/test/image.html.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 164 KiB

BIN
__tests__/snapshot/core/examples/test/rect.html.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 153 KiB

BIN
__tests__/snapshot/core/examples/test/svg.html.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 153 KiB

BIN
__tests__/snapshot/core/examples/test/text.html.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 173 KiB

11
packages/board/src/lib/scroller.ts
View file

@ -2,6 +2,7 @@ import {
TypePoint,
TypeScreenPosition
} from '@idraw/types';
import util from '@idraw/util';
type TypeOptions = {
width: number,
@ -172,10 +173,16 @@ export class Scroller {
private _getOpts(opts: TypeOptions): TypePrivateOptions {
const options = { ...{ scrollConfig: defaultScrollConfig }, ...opts};
if (!options.scrollConfig) {
options.scrollConfig = {...{}, ...defaultScrollConfig}
options.scrollConfig = defaultScrollConfig;
}
if (!(options.scrollConfig.lineWidth > 0)) {
options.scrollConfig.lineWidth = defaultScrollConfig.lineWidth;
}
options.scrollConfig.lineWidth = Math.max(options.scrollConfig.lineWidth, defaultScrollConfig.lineWidth);
if (util.color.isColorStr(options.scrollConfig.color) !== true) {
options.scrollConfig.color = options.scrollConfig.color;
}
return options;
}
}

25
packages/core/examples/features/image.html
View file

@ -1,25 +0,0 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="./css/index.css" />
<style>
html, body { margin: 0; padding: 0; }
.dashboard .row { margin: 0 }
</style>
</head>
<body>
<div class="dashboard">
<div class="row">
<div class="col">
<div id="mount"></div>
</div>
</div>
</div>
<script src="./../../dist/index.global.js"></script>
<script type="module" src="./lib/main.js"></script>
</body>
</html>

25
packages/core/examples/features/rect.html
View file

@ -1,25 +0,0 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="./css/index.css" />
<style>
html, body { margin: 0; padding: 0; }
.dashboard .row { margin: 0 }
</style>
</head>
<body>
<div class="dashboard">
<div class="row">
<div class="col">
<div id="mount"></div>
</div>
</div>
</div>
<script src="./../../dist/index.global.js"></script>
<script type="module" src="./lib/main.js"></script>
</body>
</html>

25
packages/core/examples/features/svg.html
View file

@ -1,25 +0,0 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="./css/index.css" />
<style>
html, body { margin: 0; padding: 0; }
.dashboard .row { margin: 0 }
</style>
</head>
<body>
<div class="dashboard">
<div class="row">
<div class="col">
<div id="mount"></div>
</div>
</div>
</div>
<script src="./../../dist/index.global.js"></script>
<script type="module" src="./lib/main.js"></script>
</body>
</html>

25
packages/core/examples/features/text.html
View file

@ -1,25 +0,0 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="./css/index.css" />
<style>
html, body { margin: 0; padding: 0; }
.dashboard .row { margin: 0 }
</style>
</head>
<body>
<div class="dashboard">
<div class="row">
<div class="col">
<div id="mount"></div>
</div>
</div>
</div>
<script src="./../../dist/index.global.js"></script>
<script type="module" src="./lib/main.js"></script>
</body>
</html>

40
packages/core/examples/test/image.html Normal file
View file

@ -0,0 +1,40 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
html,body { margin: 0; padding: 0; }
#mount canvas {
border-right: 1px solid #aaaaaa40;
border-bottom: 1px solid #aaaaaa40;
background-image:
linear-gradient(#aaaaaa40 1px, transparent 0),
linear-gradient(90deg, #aaaaaa40 1px, transparent 0),
linear-gradient(#aaa 1px, transparent 0),
linear-gradient(90deg, #aaa 1px, transparent 0);
background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px;
}
</style>
</head>
<body>
<div id="mount"></div>
<script src="./../../dist/index.global.js"></script>
<script type="module">
import data from './../features/lib/data/image.js';
const { Core } = window.iDraw;
const core = new Core(
document.querySelector('#mount'), {
width: 600,
height: 400,
contextWidth: 600,
contextHeight: 400,
devicePixelRatio: 4
});
core.initData(data);
core.draw();
</script>
</body>
</html>

40
packages/core/examples/test/rect.html Normal file
View file

@ -0,0 +1,40 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
html,body { margin: 0; padding: 0; }
#mount canvas {
border-right: 1px solid #aaaaaa40;
border-bottom: 1px solid #aaaaaa40;
background-image:
linear-gradient(#aaaaaa40 1px, transparent 0),
linear-gradient(90deg, #aaaaaa40 1px, transparent 0),
linear-gradient(#aaa 1px, transparent 0),
linear-gradient(90deg, #aaa 1px, transparent 0);
background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px;
}
</style>
</head>
<body>
<div id="mount"></div>
<script src="./../../dist/index.global.js"></script>
<script type="module">
import data from './../features/lib/data/svg.js';
const { Core } = window.iDraw;
const core = new Core(
document.querySelector('#mount'), {
width: 600,
height: 400,
contextWidth: 600,
contextHeight: 400,
devicePixelRatio: 4
});
core.initData(data);
core.draw();
</script>
</body>
</html>

40
packages/core/examples/test/svg.html Normal file
View file

@ -0,0 +1,40 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
html,body { margin: 0; padding: 0; }
#mount canvas {
border-right: 1px solid #aaaaaa40;
border-bottom: 1px solid #aaaaaa40;
background-image:
linear-gradient(#aaaaaa40 1px, transparent 0),
linear-gradient(90deg, #aaaaaa40 1px, transparent 0),
linear-gradient(#aaa 1px, transparent 0),
linear-gradient(90deg, #aaa 1px, transparent 0);
background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px;
}
</style>
</head>
<body>
<div id="mount"></div>
<script src="./../../dist/index.global.js"></script>
<script type="module">
import data from './../features/lib/data/svg.js';
const { Core } = window.iDraw;
const core = new Core(
document.querySelector('#mount'), {
width: 600,
height: 400,
contextWidth: 600,
contextHeight: 400,
devicePixelRatio: 4
});
core.initData(data);
core.draw();
</script>
</body>
</html>

40
packages/core/examples/test/text.html Normal file
View file

@ -0,0 +1,40 @@
<html>
<head>
<style></style>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
<style>
html,body { margin: 0; padding: 0; }
#mount canvas {
border-right: 1px solid #aaaaaa40;
border-bottom: 1px solid #aaaaaa40;
background-image:
linear-gradient(#aaaaaa40 1px, transparent 0),
linear-gradient(90deg, #aaaaaa40 1px, transparent 0),
linear-gradient(#aaa 1px, transparent 0),
linear-gradient(90deg, #aaa 1px, transparent 0);
background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px;
}
</style>
</head>
<body>
<div id="mount"></div>
<script src="./../../dist/index.global.js"></script>
<script type="module">
import data from './../features/lib/data/text.js';
const { Core } = window.iDraw;
const core = new Core(
document.querySelector('#mount'), {
width: 600,
height: 400,
contextWidth: 600,
contextHeight: 400,
devicePixelRatio: 4
});
core.initData(data);
core.draw();
</script>
</body>
</html>

10
packages/core/src/index.ts
View file

@ -66,7 +66,15 @@ class Core {
this[_data] = { elements: [] };
this[_opts] = opts;
this[_config] = mergeConfig(config || {});
this[_board] = new Board(mount, this[_opts]);
this[_board] = new Board(mount, {
...this[_opts],
canScroll: config?.scrollWrapper?.use,
scrollConfig: {
color: config?.scrollWrapper?.color || '#a0a0a0',
lineWidth: config?.scrollWrapper?.lineWidth || 12,
}
});
this[_renderer] = new Renderer(this[_board]);
this[_element] = new Element(this[_board].getContext());
this[_helper] = new Helper(this[_board], this[_config]);

7
packages/types/src/lib/config.ts
View file

@ -4,6 +4,11 @@ type TypeConfig = {
dotSize?: number,
lineWidth?: number,
lineDash?: number[],
},
scrollWrapper?: {
use?: boolean,
color?: string,
lineWidth?: number,
}
}
@ -13,7 +18,7 @@ type TypeConfigStrict = TypeConfig & {
dotSize: number,
lineWidth: number,
lineDash: number[],
}
},
}
export {

8
scripts/screen.config.js
View file

@ -8,10 +8,10 @@ const pageList = [
{ path: 'board/examples/test/scale-004.html', w: 600, h: 400, delay: 500 },
{ path: 'board/examples/test/scale-005.html', w: 600, h: 400, delay: 500 },
{ path: 'board/examples/test/scroll.html', w: 700, h: 500, delay: 500 },
{ path: 'core/examples/features/rect.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/features/text.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/features/svg.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/features/image.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/rect.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/text.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/svg.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/image.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/scale-001.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/scale-002.html', w: 600, h: 400, delay: 500 },
{ path: 'core/examples/test/scale-003.html', w: 600, h: 400, delay: 500 },