scratchfoundation/paper.js
1
0
Fork 0
mirror of https://github.com/scratchfoundation/paper.js.git synced 2025-01-03 19:45:44 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Start refactoring Color tests.

Browse source
This commit is contained in:
Jürg Lehni 2013-04-08 00:19:47 -07:00
parent a48e6e5bf9
commit 0aa6c66681
5 changed files with 81 additions and 137 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
test/lib/helpers.js
View file

@ -60,7 +60,7 @@ function asyncTest(testName, expected) {
} }
function compareNumbers(number1, number2, message) { function compareNumbers(number1, number2, message) {
equals(Format.number(number1, 2), Format.number(number2, 2), message); equals(Format.number(number1, 5), Format.number(number2, 5), message);
} }
function comparePoints(point1, point2, message) { function comparePoints(point1, point2, message) {
@ -81,40 +81,11 @@ function compareRectangles(rect1, rect2, message) {
(message || '') + ' height'); (message || '') + ' height');
} }
function compareRgbColors(color1, color2, message) { function compareColors(color1, color2, message) {
color1 = new Color(color1); color1 = new Color(color1);
color2 = new Color(color2); color2 = new Color(color2);
equals(color1.type, color2.type, (message || '') + ' type');
compareNumbers(color1.red, color2.red, equals(color1.components.toString(), color2.components.toString(), (message || '') + ' components');
(message || '') + ' red');
compareNumbers(color1.green, color2.green,
(message || '') + ' green');
compareNumbers(color1.blue, color2.blue,
(message || '') + ' blue');
compareNumbers(color1.alpha, color2.alpha,
(message || '') + ' alpha');
}
function compareHsbColors(color1, color2, message) {
color1 = new Color(color1);
color2 = new Color(color2);
compareNumbers(color1.hue, color2.hue,
(message || '') + ' hue');
compareNumbers(color1.saturation, color2.saturation,
(message || '') + ' saturation');
compareNumbers(color1.brightness, color2.brightness,
(message || '') + ' brightness');
compareNumbers(color1.alpha, color2.alpha,
(message || '') + ' alpha');
}
function compareGrayColors(color1, color2, message) {
color1 = new Color(color1);
color2 = new Color(color2);
compareNumbers(color1.gray, color2.gray,
(message || '') + ' gray');
} }
function compareGradientColors(gradientColor, gradientColor2, checkIdentity) { function compareGradientColors(gradientColor, gradientColor2, checkIdentity) {

119
test/tests/Color.js
View file

@ -15,90 +15,63 @@ module('Color');
test('Set named color', function() { test('Set named color', function() {
var path = new Path(); var path = new Path();
path.fillColor = 'red'; path.fillColor = 'red';
compareRgbColors(path.fillColor, new Color(1, 0, 0)); compareColors(path.fillColor, new Color(1, 0, 0));
equals(path.fillColor.toCss(), 'rgb(255, 0, 0)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Set color to hex', function() { test('Set color to hex', function() {
var path = new Path(); var path = new Path();
path.fillColor = '#ff0000'; path.fillColor = '#ff0000';
compareRgbColors(path.fillColor, new Color(1, 0, 0)); compareColors(path.fillColor, new Color(1, 0, 0));
equals(path.fillColor.toCss(), 'rgb(255, 0, 0)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
var path = new Path(); var path = new Path();
path.fillColor = '#f00'; path.fillColor = '#f00';
compareRgbColors(path.fillColor, new Color(1, 0, 0)); compareColors(path.fillColor, new Color(1, 0, 0));
equals(path.fillColor.toCss(), 'rgb(255, 0, 0)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Set color to object', function() { test('Set color to object', function() {
var path = new Path(); var path = new Path();
path.fillColor = { red: 1, green: 0, blue: 1}; path.fillColor = { red: 1, green: 0, blue: 1};
compareRgbColors(path.fillColor, new Color(1, 0, 1)); compareColors(path.fillColor, new Color(1, 0, 1));
equals(path.fillColor.toCss(), 'rgb(255, 0, 255)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 255)');
var path = new Path(); var path = new Path();
path.fillColor = { gray: 0.2 }; path.fillColor = { gray: 0.2 };
compareRgbColors(path.fillColor, new Color(0.8, 0.8, 0.8)); compareColors(path.fillColor, new Color(0.2));
equals(path.fillColor.toCss(), 'rgb(204, 204, 204)'); equals(path.fillColor.toCss(), 'rgb(204, 204, 204)');
}); });
test('Set color to array', function() { test('Set color to array', function() {
var path = new Path(); var path = new Path();
path.fillColor = [1, 0, 0]; path.fillColor = [1, 0, 0];
compareRgbColors(path.fillColor, new Color(1, 0, 0)); compareColors(path.fillColor, new Color(1, 0, 0));
equals(path.fillColor.toCss(), 'rgb(255, 0, 0)'); equals(path.fillColor.toCss(), 'rgb(255, 0, 0)');
}); });
test('Creating colors', function() { test('Creating colors', function() {
compareRgbColors(new Color('#ff0000'), new Color(1, 0, 0), compareColors(new Color('#ff0000'), new Color(1, 0, 0),
'RgbColor from hex code'); 'Color from hex code');
compareRgbColors(new Color({ red: 1, green: 0, blue: 1}), compareColors(new Color({ red: 1, green: 0, blue: 1}),
new Color(1, 0, 1), 'RgbColor from rgb object literal'); new Color(1, 0, 1), 'Color from rgb object literal');
compareRgbColors(new Color({ gray: 0.2 }), compareColors(new Color({ gray: 0.2 }),
new Color(0.8, 0.8, 0.8), 'RgbColor from gray object literal'); new Color(0.8, 0.8, 0.8).convert('gray'), 'Color from gray object literal');
compareRgbColors(new Color({ hue: 0, saturation: 1, brightness: 1}), compareColors(new Color({ hue: 0, saturation: 1, brightness: 1}),
new Color(1, 0, 0), 'RgbColor from hsb object literal'); new Color(1, 0, 0).convert('hsb'), 'Color from hsb object literal');
compareRgbColors(new Color([1, 0, 0]), new Color(1, 0, 0), compareColors(new Color([1, 0, 0]), new Color(1, 0, 0),
'RgbColor from array'); 'Rgb Color from array');
compareHsbColors(new HsbColor('#000000'), new HsbColor(0, 0, 0), compareColors(new Color([1]), new Color(1),
'HsbColor from hex code'); 'Gray Color from array');
compareHsbColors(new HsbColor({ red: 1, green: 0, blue: 0}),
new HsbColor(0, 1, 1), 'HsbColor from rgb object literal');
compareHsbColors(new HsbColor({ gray: 0.8 }),
new HsbColor(0, 0, 0.2), 'RgbColor from gray object literal');
compareHsbColors(new HsbColor([1, 0, 0]), new HsbColor(1, 0, 0),
'HsbColor from array');
compareGrayColors(new GrayColor('#000000'), new GrayColor(1),
'GrayColor from hex code');
compareGrayColors(new GrayColor('#ffffff'), new GrayColor(0),
'GrayColor from hex code');
compareGrayColors(new GrayColor({ red: 1, green: 1, blue: 1}),
new GrayColor(0), 'GrayColor from rgb object literal');
compareGrayColors(new GrayColor({ gray: 0.2 }),
new GrayColor(0.2), 'GrayColor from gray object literal');
compareGrayColors(new GrayColor({ hue: 0, saturation: 0, brightness: 0.8}),
new GrayColor(0.2), 'GrayColor from hsb object literal');
compareGrayColors(new GrayColor([1]), new GrayColor(1),
'GrayColor from array');
}); });
test('Get gray from RgbColor', function() { test('Get gray from RGB Color', function() {
var color = new Color(1, 0.5, 0.2); var color = new Color(1, 0.5, 0.2);
compareNumbers(color.gray, 0.38458251953125); compareNumbers(color.gray, 0.38458251953125);
@ -106,70 +79,70 @@ test('Get gray from RgbColor', function() {
compareNumbers(color.gray, 0.72137451171875); compareNumbers(color.gray, 0.72137451171875);
}); });
test('Get gray from HsbColor', function() { test('Get gray from HSB Color', function() {
var color = new HsbColor(0, 0, 0.2); var color = new HsbColor(0, 0, 0.2);
compareNumbers(color.gray, 0.8); compareNumbers(color.gray, 0.8);
}); });
test('Get red from HsbColor', function() { test('Get red from HSB Color', function() {
var color = new HsbColor(0, 1, 1); var color = new HsbColor(0, 1, 1);
compareNumbers(color.red, 1); compareNumbers(color.red, 1);
}); });
test('Get hue from RgbColor', function() { test('Get hue from RGB Color', function() {
var color = new Color(1, 0, 0); var color = new Color(1, 0, 0);
compareNumbers(color.hue, 0); compareNumbers(color.hue, 0);
compareNumbers(color.saturation, 1); compareNumbers(color.saturation, 1);
}); });
test('Gray Color', function() { test('Gray Color', function() {
var color = new GrayColor(1); var color = new Color(1);
compareNumbers(color.gray, 1); compareNumbers(color.gray, 1);
compareNumbers(color.red, 0); compareNumbers(color.red, 0);
compareNumbers(color.blue, 0);
color.red = 0.5; color.red = 0.5;
compareNumbers(color.gray, '0.84999'); compareNumbers(color.gray, 0.85055);
color.green = 0.2; color.green = 0.2;
compareNumbers(color.gray, '0.82051');
compareNumbers(color.red, 0.5);
compareNumbers(color.green, 0.2);
compareNumbers(color.blue, 0);
compareNumbers(color.gray, 0.73315);
}); });
test('Converting Colors', function() { test('Converting Colors', function() {
var rgbColor = new Color(1, 0.5, 0.2); var rgbColor = new Color(1, 0.5, 0.2);
compareNumbers(new GrayColor(rgbColor).gray, 0.38299560546875); compareNumbers(rgbColor.gray, 0.38299560546875);
var grayColor = new Color(0.2);
var grayColor = new GrayColor(0.2); compareColors(grayColor.convert('rgb'), new Color(0.8, 0.8, 0.8));
var rgbColor = new Color(grayColor); compareColors(grayColor.convert('hsb'), { hue: 0, saturation: 0, brightness: 0.8 });
compareRgbColors(rgbColor, [ 0.8, 0.8, 0.8, 1]); compareColors(new Color(1, 0, 0).convert('hsb'), { hue: 0, saturation: 1, brightness: 1 });
var hsbColor = new HsbColor(grayColor);
compareHsbColors(hsbColor, [ 0, 0, 0.8, 1]);
var rgbColor = new Color(1, 0, 0);
compareHsbColors(new HsbColor(rgbColor), [0, 1, 1, 1]);
}); });
test('Setting RgbColor#gray', function() { test('Setting Color#gray', function() {
var color = new Color(1, 0.5, 0.2); var color = new Color(1, 0.5, 0.2);
color.gray = 0.1; color.gray = 0.1;
compareRgbColors(color, [ 0.9, 0.9, 0.9, 1]); compareColors(color, new Color(0.1));
}); });
test('Setting HsbColor#red', function() { test('Setting Color#red', function() {
var color = new HsbColor(180, 0, 0); var color = new Color({ hue: 180, saturation: 0, brightness: 0 });
color.red = 1; color.red = 1;
compareHsbColors(color, [0, 1, 1, 1]); compareColors(color, new Color(0, 1, 1));
}); });
test('Setting HsbColor#gray', function() { test('Setting Color#gray', function() {
var color = new HsbColor(180, 0, 0); var color = new Color({ hue: 180, saturation: 0, brightness: 0 });
color.gray = 0.5; color.gray = 0.5;
compareHsbColors(color, [0, 0, 0.5, 1]); compareColors(color, new Color(0.5));
}); });
test('Color.read(channels)', function() { test('Color.read(channels)', function() {
var color = Color.read([0, 0, 1]); var color = Color.read([0, 0, 1]);
compareRgbColors(color, [0, 0, 1, 1]); compareColors(color, new Color(0, 0, 1));
}); });
test('Cloning colors', function() { test('Cloning colors', function() {
@ -196,6 +169,6 @@ test('Color#convert', function() {
test('Saturation from black rgb', function() { test('Saturation from black rgb', function() {
equals(function() { equals(function() {
return new Color(0, 0, 0).saturation == 0; return new Color(0, 0, 0).saturation === 0;
}, true); }, true);
}); });

8
test/tests/Item.js
View file

@ -641,9 +641,9 @@ test('Item#blendMode in a transformed Group', function() {
}); });
var raster = layer.rasterize(); var raster = layer.rasterize();
compareRgbColors(raster.getPixel(0, 0), new Color(1, 0, 0), compareColors(raster.getPixel(0, 0), new Color(1, 0, 0),
'Top left pixel should be red:'); 'Top left pixel should be red:');
compareRgbColors(raster.getPixel(50, 50), new Color(1, 1, 0), compareColors(raster.getPixel(50, 50), new Color(1, 1, 0),
'Middle center pixel should be yellow:'); 'Middle center pixel should be yellow:');
raster.remove(); raster.remove();
@ -653,8 +653,8 @@ test('Item#blendMode in a transformed Group', function() {
group.position = [50, 50]; group.position = [50, 50];
var raster = layer.rasterize(); var raster = layer.rasterize();
compareRgbColors(raster.getPixel(0, 0), new Color(1, 0, 0), compareColors(raster.getPixel(0, 0), new Color(1, 0, 0),
'Top left pixel should be red:'); 'Top left pixel should be red:');
compareRgbColors(raster.getPixel(50, 50), new Color(1, 1, 0), compareColors(raster.getPixel(50, 50), new Color(1, 1, 0),
'Middle center pixel should be yellow:'); 'Middle center pixel should be yellow:');
}); });

40
test/tests/PathStyle.js
View file

@ -37,12 +37,12 @@ test('style defaults', function() {
test('currentStyle', function() { test('currentStyle', function() {
paper.project.currentStyle.fillColor = 'black'; paper.project.currentStyle.fillColor = 'black';
var path = new Path(); var path = new Path();
compareRgbColors(path.fillColor, 'black', 'path.fillColor'); compareColors(path.fillColor, 'black', 'path.fillColor');
// When changing the current style of the project, the style of // When changing the current style of the project, the style of
// paths created using project.currentStyle should not change. // paths created using project.currentStyle should not change.
paper.project.currentStyle.fillColor = 'red'; paper.project.currentStyle.fillColor = 'red';
compareRgbColors(path.fillColor, 'black', 'path.fillColor'); compareColors(path.fillColor, 'black', 'path.fillColor');
}); });
test('setting currentStyle to an object', function() { test('setting currentStyle to an object', function() {
@ -51,8 +51,8 @@ test('setting currentStyle to an object', function() {
strokeColor: 'green' strokeColor: 'green'
}; };
var path = new Path(); var path = new Path();
compareRgbColors(path.fillColor, 'red', 'path.fillColor'); compareColors(path.fillColor, 'red', 'path.fillColor');
compareRgbColors(path.strokeColor, 'green', 'path.strokeColor'); compareColors(path.strokeColor, 'green', 'path.strokeColor');
}); });
test('setting path styles to an object', function() { test('setting path styles to an object', function() {
@ -61,8 +61,8 @@ test('setting path styles to an object', function() {
fillColor: 'red', fillColor: 'red',
strokeColor: 'green' strokeColor: 'green'
}; };
compareRgbColors(path.fillColor, 'red', 'path.fillColor'); compareColors(path.fillColor, 'red', 'path.fillColor');
compareRgbColors(path.strokeColor, 'green', 'path.strokeColor'); compareColors(path.strokeColor, 'green', 'path.strokeColor');
}); });
test('setting group styles to an object', function() { test('setting group styles to an object', function() {
@ -73,8 +73,8 @@ test('setting group styles to an object', function() {
fillColor: 'red', fillColor: 'red',
strokeColor: 'green' strokeColor: 'green'
}; };
compareRgbColors(path.fillColor, 'red', 'path.fillColor'); compareColors(path.fillColor, 'red', 'path.fillColor');
compareRgbColors(path.strokeColor, 'green', 'path.strokeColor'); compareColors(path.strokeColor, 'green', 'path.strokeColor');
}); });
test('getting group styles', function() { test('getting group styles', function() {
@ -83,7 +83,7 @@ test('getting group styles', function() {
path.fillColor = 'red'; path.fillColor = 'red';
group.addChild(path); group.addChild(path);
compareRgbColors(group.fillColor, 'red', 'group.fillColor'); compareColors(group.fillColor, 'red', 'group.fillColor');
var secondPath = new Path(); var secondPath = new Path();
secondPath.fillColor = 'black'; secondPath.fillColor = 'black';
@ -97,7 +97,7 @@ test('getting group styles', function() {
//If we remove the first path, it should now return 'black': //If we remove the first path, it should now return 'black':
group.children[0].remove(); group.children[0].remove();
compareRgbColors(group.fillColor, 'black', 'group.fillColor'); compareColors(group.fillColor, 'black', 'group.fillColor');
}); });
test('setting group styles', function() { test('setting group styles', function() {
@ -116,11 +116,11 @@ test('setting group styles', function() {
// the paths contained in the group should now both have their fillColor // the paths contained in the group should now both have their fillColor
// set to black: // set to black:
compareRgbColors(path.fillColor, 'black', 'path.fillColor'); compareColors(path.fillColor, 'black', 'path.fillColor');
compareRgbColors(secondPath.fillColor, 'black', 'secondPath.fillColor'); compareColors(secondPath.fillColor, 'black', 'secondPath.fillColor');
// The second path still has its strokeColor set to red: // The second path still has its strokeColor set to red:
compareRgbColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor'); compareColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor');
}); });
test('setting group styles 2', function() { test('setting group styles 2', function() {
@ -129,15 +129,15 @@ test('setting group styles 2', function() {
path.fillColor = 'red'; path.fillColor = 'red';
group.addChild(path); group.addChild(path);
compareRgbColors(group.fillColor, 'red', 'group.fillColor'); compareColors(group.fillColor, 'red', 'group.fillColor');
var secondPath = new Path(); var secondPath = new Path();
secondPath.fillColor = 'blue'; secondPath.fillColor = 'blue';
secondPath.strokeColor = 'red'; secondPath.strokeColor = 'red';
group.addChild(secondPath); group.addChild(secondPath);
compareRgbColors(secondPath.fillColor, 'blue', 'secondPath.fillColor'); compareColors(secondPath.fillColor, 'blue', 'secondPath.fillColor');
compareRgbColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor'); compareColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor');
// By appending a path with a different fillcolor, // By appending a path with a different fillcolor,
// the group's fillColor should return undefined: // the group's fillColor should return undefined:
@ -146,16 +146,16 @@ test('setting group styles 2', function() {
}, undefined); }, undefined);
// But, both paths have a red strokeColor, so: // But, both paths have a red strokeColor, so:
compareRgbColors(group.strokeColor, 'red', 'group.strokeColor'); compareColors(group.strokeColor, 'red', 'group.strokeColor');
// Change the fill color of the group's style: // Change the fill color of the group's style:
group.style.fillColor = 'black'; group.style.fillColor = 'black';
// the paths contained in the group should now both have their fillColor // the paths contained in the group should now both have their fillColor
// set to black: // set to black:
compareRgbColors(path.fillColor, 'black', 'path.fillColor'); compareColors(path.fillColor, 'black', 'path.fillColor');
compareRgbColors(secondPath.fillColor, 'black', 'secondPath.fillColor'); compareColors(secondPath.fillColor, 'black', 'secondPath.fillColor');
// The second path still has its strokeColor set to red: // The second path still has its strokeColor set to red:
compareRgbColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor'); compareColors(secondPath.strokeColor, 'red', 'secondPath.strokeColor');
}); });

14
test/tests/Raster.js
View file

@ -78,14 +78,14 @@ asyncTest('Create a raster from a dom id', function(callback) {
asyncTest('Raster#getPixel / setPixel', function(callback) { asyncTest('Raster#getPixel / setPixel', function(callback) {
var raster = new Raster('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABlJREFUeNpi+s/AwPCfgYmR4f9/hv8AAQYAHiAFAS8Lwy8AAAAASUVORK5CYII='); var raster = new Raster('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAIAAAD91JpzAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABlJREFUeNpi+s/AwPCfgYmR4f9/hv8AAQYAHiAFAS8Lwy8AAAAASUVORK5CYII=');
raster.onLoad = function() { raster.onLoad = function() {
compareRgbColors(raster.getPixel(0, 0), new Color(1, 0, 0)); compareColors(raster.getPixel(0, 0), new Color(1, 0, 0));
compareRgbColors(raster.getPixel(1, 0), new Color(0, 1, 0)); compareColors(raster.getPixel(1, 0), new Color(0, 1, 0));
compareRgbColors(raster.getPixel(0, 1), new Color(0, 0, 1)); compareColors(raster.getPixel(0, 1), new Color(0, 0, 1));
compareRgbColors(raster.getPixel(1, 1), new Color(1, 1, 1)); compareColors(raster.getPixel(1, 1), new Color(1, 1, 1));
var color = new Color(1, 1, 0, 0.5); var color = new Color(1, 1, 0, 0.5);
raster.setPixel([0, 0], color); raster.setPixel([0, 0], color);
compareRgbColors(raster.getPixel([0, 0]), color); compareColors(raster.getPixel([0, 0]), color);
callback(); callback();
}; };
}); });
@ -130,7 +130,7 @@ test('Raster#getAverageColor(path)', function() {
}); });
var raster = paper.project.activeLayer.rasterize(); var raster = paper.project.activeLayer.rasterize();
path.scale(0.9); path.scale(0.9);
compareRgbColors(raster.getAverageColor(path), new Color(1, 0, 0)); compareColors(raster.getAverageColor(path), new Color(1, 0, 0));
}); });
test('Raster#getAverageColor(path) with compound path', function() { test('Raster#getAverageColor(path) with compound path', function() {
@ -152,5 +152,5 @@ test('Raster#getAverageColor(path) with compound path', function() {
var raster = paper.project.activeLayer.rasterize(); var raster = paper.project.activeLayer.rasterize();
path.scale(0.9); path.scale(0.9);
path2.scale(1.1); path2.scale(1.1);
compareRgbColors(raster.getAverageColor(compoundPath), new Color(1, 0, 0)); compareColors(raster.getAverageColor(compoundPath), new Color(1, 0, 0));
}); });