Skip to content

Commit 5718547

Browse files
archmojarchmoj
committed
add baseline and jasmine tests using virtual-webgl
1 parent d5c03d8 commit 5718547

File tree

6 files changed

+158
-10
lines changed

6 files changed

+158
-10
lines changed

‎.circleci/config.yml

+62
Original file line numberDiff line numberDiff line change
@@ -122,6 +122,26 @@ jobs:
122122
name: Run jasmine tests (part B)
123123
command: .circleci/test.sh webgl-jasmine
124124

125+
virtual-webgl-jasmine:
126+
docker:
127+
# need '-browsers' version to test in real (xvfb-wrapped) browsers
128+
- image: cimg/node:16.17.1-browsers
129+
environment:
130+
# Alaska time (arbitrary timezone to test date logic)
131+
TZ: "America/Anchorage"
132+
parallelism: 8
133+
working_directory: ~/plotly.js
134+
steps:
135+
- browser-tools/install-browser-tools: &browser-versions
136+
chrome-version: 110.0.5481.100
137+
install-firefox: false
138+
install-geckodriver: false
139+
- attach_workspace:
140+
at: ~/
141+
- run:
142+
name: Run jasmine tests (part B)
143+
command: .circleci/test.sh virtual-webgl-jasmine
144+
125145
flaky-no-gl-jasmine:
126146
docker:
127147
# need '-browsers' version to test in real (xvfb-wrapped) browsers
@@ -216,6 +236,25 @@ jobs:
216236
name: Test MathJax on firefox-latest
217237
command: .circleci/test.sh mathjax-firefox82+
218238

239+
make-baselines-virtual-webgl:
240+
parallelism: 2
241+
docker:
242+
- image: circleci/python:3.8.9
243+
working_directory: ~/plotly.js
244+
steps:
245+
- attach_workspace:
246+
at: ~/
247+
- run:
248+
name: Install kaleido, plotly.io and required fonts
249+
command: .circleci/env_image.sh
250+
- run:
251+
name: Create png files using virtual-webgl & WebGL v1
252+
command: .circleci/test.sh make-baselines-virtual-webgl
253+
- persist_to_workspace:
254+
root: ~/
255+
paths:
256+
- plotly.js
257+
219258
make-baselines-mathjax3:
220259
docker:
221260
- image: circleci/python:3.8.9
@@ -267,6 +306,20 @@ jobs:
267306
path: build
268307
destination: /
269308

309+
test-baselines-virtual-webgl:
310+
docker:
311+
- image: circleci/node:16.9.0
312+
working_directory: ~/plotly.js
313+
steps:
314+
- attach_workspace:
315+
at: ~/
316+
- run:
317+
name: Compare pixels
318+
command: .circleci/test.sh test-image-virtual-webgl ; find build -maxdepth 1 -type f -delete
319+
- store_artifacts:
320+
path: build
321+
destination: /
322+
270323
test-baselines-mathjax3:
271324
docker:
272325
- image: circleci/node:16.9.0
@@ -441,9 +494,18 @@ workflows:
441494
- webgl-jasmine:
442495
requires:
443496
- install-and-cibuild
497+
- virtual-webgl-jasmine:
498+
requires:
499+
- install-and-cibuild
444500
- flaky-no-gl-jasmine:
445501
requires:
446502
- install-and-cibuild
503+
- make-baselines-virtual-webgl:
504+
requires:
505+
- install-and-cibuild
506+
- test-baselines-virtual-webgl:
507+
requires:
508+
- make-baselines-virtual-webgl
447509
- make-baselines-mathjax3:
448510
requires:
449511
- install-and-cibuild

‎.circleci/test.sh

+24
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,16 @@ case $1 in
5353
exit $EXIT_STATE
5454
;;
5555

56+
virtual-webgl-jasmine)
57+
SHARDS=($(node $ROOT/tasks/shard_jasmine_tests.js --limit=5 --tag=gl | circleci tests split))
58+
for s in ${SHARDS[@]}; do
59+
MAX_AUTO_RETRY=2
60+
retry ./node_modules/karma/bin/karma start test/jasmine/karma.conf.js --virtualWebgl --tags=gl --skip-tags=noCI,noVirtualWebgl --doNotFailOnEmptyTestSuite -- "$s"
61+
done
62+
63+
exit $EXIT_STATE
64+
;;
65+
5666
flaky-no-gl-jasmine)
5767
SHARDS=($(node $ROOT/tasks/shard_jasmine_tests.js --limit=1 --tag=flaky | circleci tests split))
5868

@@ -82,6 +92,15 @@ case $1 in
8292
exit $EXIT_STATE
8393
;;
8494

95+
make-baselines-virtual-webgl)
96+
SUITE=$({\
97+
find $ROOT/test/image/mocks/gl* -type f -printf "%f\n"; \
98+
find $ROOT/test/image/mocks/mapbox* -type f -printf "%f\n"; \
99+
} | sed 's/\.json$//1' | circleci tests split)
100+
python3 test/image/make_baseline.py virtual-webgl $SUITE || EXIT_STATE=$?
101+
exit $EXIT_STATE
102+
;;
103+
85104
make-baselines-mathjax3)
86105
python3 test/image/make_baseline.py mathjax3 legend_mathjax_title_and_items mathjax parcats_grid_subplots table_latex_multitrace_scatter table_plain_birds table_wrapped_birds ternary-mathjax || EXIT_STATE=$?
87106
exit $EXIT_STATE
@@ -103,6 +122,11 @@ case $1 in
103122
exit $EXIT_STATE
104123
;;
105124

125+
test-image-virtual-webgl)
126+
node test/image/compare_pixels_test.js virtual-webgl || { tar -cvf build/baselines.tar build/test_images/*.png ; exit 1 ; } || EXIT_STATE=$?
127+
exit $EXIT_STATE
128+
;;
129+
106130
source-syntax)
107131
npm run lint || EXIT_STATE=$?
108132
npm run test-syntax || EXIT_STATE=$?

‎test/image/compare_pixels_test.js

+44-8
Original file line numberDiff line numberDiff line change
@@ -42,9 +42,13 @@ if(argv._.length === 0) {
4242
// Build list of mocks to compare
4343
var allMockList = [];
4444
var mathjax3;
45+
var virtualWebgl = false;
4546
argv._.forEach(function(pattern) {
4647
if(pattern === 'mathjax3') {
4748
mathjax3 = true;
49+
} else if(pattern === 'virtual-webgl') {
50+
virtualWebgl = true;
51+
allMockList = getMockList('');
4852
} else {
4953
var mockList = getMockList(pattern);
5054

@@ -66,6 +70,12 @@ allMockList = allMockList.filter(function(a) {
6670
);
6771
});
6872

73+
if(virtualWebgl) {
74+
allMockList = allMockList.filter(function(a) {
75+
return a.slice(0, 2) === 'gl' || a.slice(0, 6) === 'mapbox';
76+
});
77+
}
78+
6979
if(mathjax3) {
7080
allMockList = [
7181
'legend_mathjax_title_and_items',
@@ -91,6 +101,7 @@ var fail = function(mockName) {
91101
failed.push(mockName);
92102
}
93103
};
104+
94105
for(var i = 0; i < allMockList.length; i++) {
95106
var mockName = allMockList[i];
96107

@@ -102,6 +113,18 @@ for(var i = 0; i < allMockList.length; i++) {
102113
continue;
103114
}
104115

116+
// the following mocks than only have regl-line2d lines (no morkers),
117+
// do not render at first draw when using virtual webgl. TODO: find a fix
118+
if(virtualWebgl && [
119+
'gl2d_connect_gaps',
120+
'gl2d_line_select',
121+
'gl2d_lines_almost_horizontal_vertical',
122+
'gl2d_scattergl_simple_line_reversed_ranges',
123+
'gl2d_subplots_anchor'
124+
].indexOf(mockName) !== -1) {
125+
continue;
126+
}
127+
105128
var isMapbox = mockName.substr(0, 7) === 'mapbox_';
106129
var isOtherFlaky = [
107130
// list flaky mocks other than mapbox:
@@ -151,15 +174,28 @@ for(var i = 0; i < allMockList.length; i++) {
151174

152175
var shouldBePixelPerfect = !(isMapbox || isOtherFlaky);
153176

177+
var threshold = shouldBePixelPerfect ? 0 : [
178+
// more flaky
179+
'mapbox_angles',
180+
'mapbox_layers',
181+
'mapbox_custom-style',
182+
'mapbox_geojson-attributes'
183+
].indexOf(mockName) !== -1 ? 1 : 0.15;
184+
185+
if(virtualWebgl) {
186+
threshold = Math.max(0.4, threshold);
187+
if([
188+
'gl3d_ibm-plot',
189+
'gl3d_isosurface_2surfaces-checker_spaceframe',
190+
'gl3d_opacity-scaling-spikes',
191+
'gl3d_cone-wind',
192+
'gl3d_isosurface_math',
193+
'gl3d_scatter3d-blank-text'
194+
].indexOf(mockName) !== -1) threshold = 0.7;
195+
}
196+
154197
var numDiffPixels = pixelmatch(img0.data, img1.data, diff.data, width, height, {
155-
threshold: shouldBePixelPerfect ? 0 :
156-
[
157-
// more flaky
158-
'mapbox_angles',
159-
'mapbox_layers',
160-
'mapbox_custom-style',
161-
'mapbox_geojson-attributes'
162-
].indexOf(mockName) !== -1 ? 1 : 0.15
198+
threshold: threshold
163199
});
164200

165201
if(numDiffPixels) {

‎test/image/make_baseline.py

+19-1
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,11 @@
1010
args = sys.argv
1111

1212
root = os.getcwd()
13+
14+
virtual_webgl = os.path.join(root, 'node_modules', 'virtual-webgl', 'src', 'virtual-webgl.js')
15+
plotlyjs = os.path.join(root, 'build', 'plotly.js')
16+
plotlyjs_with_virtual_webgl = os.path.join(root, 'build', 'plotly_with_virtual-webgl.js')
17+
1318
dirIn = os.path.join(root, 'test', 'image', 'mocks')
1419
dirOut = os.path.join(root, 'build', 'test_images')
1520

@@ -33,8 +38,21 @@
3338
mathjax_version = 3
3439
print('Kaleido using MathJax v3')
3540

41+
virtual_webgl_version = 0 # i.e. virtual-webgl is not used
42+
if 'virtual-webgl' in sys.argv or 'virtual-webgl=' in sys.argv :
43+
virtual_webgl_version = 1
44+
print('using virtual-webgl for WebGL v1')
45+
46+
with open(plotlyjs_with_virtual_webgl, 'w') as fileOut:
47+
for filename in [virtual_webgl, plotlyjs]:
48+
with open(filename, 'r') as fileIn:
49+
for line in fileIn:
50+
fileOut.write(line)
51+
52+
plotlyjs = plotlyjs_with_virtual_webgl
53+
54+
pio.kaleido.scope.plotlyjs = plotlyjs
3655
pio.templates.default = 'none'
37-
pio.kaleido.scope.plotlyjs = os.path.join(root, 'build', 'plotly.js')
3856

3957
_credentials = open(os.path.join(root, 'build', 'credentials.json'), 'r')
4058
pio.kaleido.scope.mapbox_access_token = json.load(_credentials)['MAPBOX_ACCESS_TOKEN']

‎test/jasmine/karma.conf.js

+8
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,7 @@ var pathToUnpolyfill = path.join(__dirname, 'assets', 'unpolyfill.js');
127127
var pathToSaneTopojsonDist = path.join(__dirname, '..', '..', 'node_modules', 'sane-topojson', 'dist');
128128
var pathToMathJax2 = path.join(__dirname, '..', '..', 'node_modules', 'mathjax-v2');
129129
var pathToMathJax3 = path.join(__dirname, '..', '..', 'node_modules', 'mathjax-v3');
130+
var pathToVirtualWebgl = path.join(__dirname, '..', '..', 'node_modules', 'virtual-webgl', 'src', 'virtual-webgl.js');
130131

131132
var reporters = [];
132133
if(argv['report-progress'] || argv['report-spec'] || argv['report-dots']) {
@@ -351,6 +352,13 @@ if(isBundleTest) {
351352
func.defaultConfig.files.push(pathToJQuery);
352353
}
353354

355+
if(argv.virtualWebgl) {
356+
// add virtual-webgl to the top
357+
func.defaultConfig.files = [
358+
pathToVirtualWebgl
359+
].concat(func.defaultConfig.files);
360+
}
361+
354362
// lastly, load test file glob
355363
func.defaultConfig.files.push(testFileGlob);
356364

‎test/jasmine/tests/gl3d_plot_interact_test.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -2156,7 +2156,7 @@ describe('Test removal of gl contexts', function() {
21562156
.then(done, done.fail);
21572157
});
21582158

2159-
it('@gl should fire *plotly_webglcontextlost* when on webgl context lost', function(done) {
2159+
it('@gl @noVirtualWebgl should fire *plotly_webglcontextlost* when on webgl context lost', function(done) {
21602160
var _mock = Lib.extendDeep({}, require('../../image/mocks/gl3d_marker-arrays.json'));
21612161

21622162
Plotly.newPlot(gd, _mock).then(function() {

0 commit comments

Comments
 (0)