Skip to content

Second jasmine test to lock issue 3101#3195

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
archmoj merged 1 commit into from
Nov 1, 2018
Merged

Second jasmine test to lock issue 3101 #3195

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
82 changes: 60 additions & 22 deletions test/jasmine/tests/parcoords_test.js
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -45,6 +45,23 @@ function purgeGraphDiv(done) {
return delay(50)().then(done);
}

function getAvgPixelByChannel(id) {
var canvas = d3.select(id).node();

var imgData = readPixel(canvas, 0, 0, canvas.width, canvas.height);
var n = imgData.length * 0.25;

@archmojarchmojOct 31, 2018

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A minor change here:
instead of dividing by 4, we use multiply by 0.25 so that we return rgb fractions and avoid possibility of rounding small values to 0.

@alexcjohnsonalexcjohnsonOct 31, 2018

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't cause problems but... is there actually a difference between these in js? anyway n should always be an integer, right?

plotly.js/test/jasmine/assets/read_pixel.js

Line 11 in 458f593

varpixels=newUint8Array(4*w*h);

@etpinardetpinardOct 31, 2018

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm curious. Can you share an example of this happening in JS?

@alexcjohnsonalexcjohnsonOct 31, 2018

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(am I missing something? why didn't that link get turned into a code snippet?)

@archmojarchmojOct 31, 2018

Copy link
Copy Markdown
ContributorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You are totally right and I tested this on IE, FF and Chrome too.
In JS there is actually no difference in JS between multiplying by 0.25.
Thanks for the note.

@etpinardetpinardNov 1, 2018•
edited
Loading

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

(am I missing something? why didn't that link get turned into a code snippet?)

image

it's rendering fine now. I'll blame that hiccup on Microsoft.

Thanks for the note.

Thank you for double checking!

var r = 0;
var g = 0;
var b = 0;

for(var i = 0; i < imgData.length; i++) {
r += imgData[i++];
g += imgData[i++];
b += imgData[i++];
}
return [r / n, g / n, b / n];
}

describe('parcoords initialization tests', function() {

'use strict';
Expand DownExpand Up@@ -799,22 +816,39 @@ describe('parcoords Lifecycle methods', function() {
});
});

it('@gl line.color `Plotly.restyle` should work', function(done) {
function getAvgPixelByChannel() {
var canvas = d3.select('.gl-canvas-focus').node();
var imgData = readPixel(canvas, 0, 0, canvas.width, canvas.height);
var n = imgData.length / 4;
var r = 0;
var g = 0;
var b = 0;

for(var i = 0; i < imgData.length; i++) {
r += imgData[i++];
g += imgData[i++];
b += imgData[i++];
}
return [r / n, g / n, b / n];
}
it('@gl line.color `Plotly.restyle` should change focus layer', function(done) {
var testLayer = '.gl-canvas-focus';
Plotly.plot(gd, [{
type: 'parcoords',
dimensions: [{
values: [1, 2]
}, {
values: [2, 4]
}],
line: {color: 'blue'}
}], {
width: 300,
height: 200
})
.then(function() {
var rgb = getAvgPixelByChannel(testLayer);
expect(rgb[0]).toBe(0, 'no red');
expect(rgb[2]).not.toBe(0, 'all blue');

return Plotly.restyle(gd, 'line.color', 'red');
})
.then(function() {
var rgb = getAvgPixelByChannel(testLayer);
expect(rgb[0]).not.toBe(0, 'all red');
expect(rgb[2]).toBe(0, 'no blue');
})
.catch(failTest)
.then(done);
});

it('@gl line.color `Plotly.restyle` should not change context layer', function(done) {
var testLayer = '.gl-canvas-context';
var old_rgb, new_rgb;

Plotly.plot(gd, [{
type: 'parcoords',
Expand All@@ -829,16 +863,20 @@ describe('parcoords Lifecycle methods', function() {
height: 200
})
.then(function() {
var rbg = getAvgPixelByChannel();
expect(rbg[0]).toBe(0, 'no red');
expect(rbg[2]).not.toBe(0, 'all blue');
var rgb = getAvgPixelByChannel(testLayer);
old_rgb = rgb[0] + rgb[1] + rgb[2] / 3.0;
expect(old_rgb).toBeGreaterThan(0, 'not all black');
expect(old_rgb).toBeLessThan(255, 'not all white');

return Plotly.restyle(gd, 'line.color', 'red');
})
.then(function() {
var rbg = getAvgPixelByChannel();
expect(rbg[0]).not.toBe(0, 'all red');
expect(rbg[2]).toBe(0, 'no blue');
var rgb = getAvgPixelByChannel(testLayer);
new_rgb = rgb[0] + rgb[1] + rgb[2] / 3.0;
expect(new_rgb).toBeGreaterThan(0, 'not all black');
expect(new_rgb).toBeLessThan(255, 'not all white');

expect(new_rgb).toBe(old_rgb, 'no change to context');
})
.catch(failTest)
.then(done);
Expand Down