feat:Added piechart in Dashboard
This commit is contained in:
+104
@@ -0,0 +1,104 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>SVG.js - Jasmine Spec Runner v2.6.0</title>
|
||||
|
||||
<link rel="shortcut icon" type="image/png" href="lib/jasmine-2.6.0/jasmine_favicon.png">
|
||||
<link rel="stylesheet" href="lib/jasmine-2.6.0/jasmine.css">
|
||||
|
||||
<script src="lib/jasmine-2.6.0/jasmine.js"></script>
|
||||
<script src="lib/jasmine-2.6.0/jasmine-html.js"></script>
|
||||
<script src="lib/jasmine-2.6.0/boot.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="fixtures/fixture.css">
|
||||
|
||||
<!-- include source files here... -->
|
||||
<script src="../dist/svg.js" charset="utf-8"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<svg height="0" width="0" id="inlineSVG">
|
||||
<defs>
|
||||
<linearGradient>
|
||||
<stop offset="5%" stop-color="green"/>
|
||||
<stop offset="95%" stop-color="gold"/>
|
||||
</linearGradient>
|
||||
<radialGradient>
|
||||
<stop offset="10%" stop-color="gold"/>
|
||||
<stop offset="95%" stop-color="green"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<desc>Some description</desc>
|
||||
<path id="lineAB" d="M 100 350 l 150 -300" stroke="red" stroke-width="3" fill="none" />
|
||||
<path id="lineBC" d="M 250 50 l 150 300" stroke="red" stroke-width="3" fill="none" />
|
||||
<path d="M 175 200 l 150 0" stroke="green" stroke-width="3" fill="none" />
|
||||
<path d="M 100 350 q 150 -300 300 0" stroke="blue" stroke-width="5" fill="none" />
|
||||
<g stroke="black" stroke-width="3" fill="black" id="pointGroup">
|
||||
<circle id="pointA" cx="100" cy="350" r="3" />
|
||||
<circle id="pointB" cx="250" cy="50" r="3" />
|
||||
<circle id="pointC" cx="400" cy="350" r="3" />
|
||||
</g>
|
||||
<g font-size="30" font="sans-serif" fill="black" stroke="none" text-anchor="middle" id="labelGroup">
|
||||
<text x="100" y="350" dx="-30">A</text>
|
||||
<text x="250" y="50" dy="-10">B</text>
|
||||
<text x="400" y="350" dx="30">C</text>
|
||||
</g>
|
||||
<polygon points="200,10 250,190 160,210" />
|
||||
<polyline points="20,20 40,25 60,40 80,120 120,140 200,180" />
|
||||
</svg>
|
||||
|
||||
|
||||
<!-- include spec files here... -->
|
||||
<script src="spec/adopter.js"></script>
|
||||
<script src="spec/arrange.js"></script>
|
||||
<script src="spec/array.js"></script>
|
||||
<script src="spec/bare.js"></script>
|
||||
<script src="spec/boxes.js"></script>
|
||||
<script src="spec/circle.js"></script>
|
||||
<script src="spec/clip.js"></script>
|
||||
<script src="spec/color.js"></script>
|
||||
<script src="spec/container.js"></script>
|
||||
<script src="spec/defs.js"></script>
|
||||
<script src="spec/doc.js"></script>
|
||||
<script src="spec/easing.js"></script>
|
||||
<script src="spec/element.js"></script>
|
||||
<script src="spec/ellipse.js"></script>
|
||||
<script src="spec/event.js"></script>
|
||||
<script src="spec/fx.js"></script>
|
||||
<script src="spec/gradient.js"></script>
|
||||
<script src="spec/group.js"></script>
|
||||
<script src="spec/helper.js"></script>
|
||||
<script src="spec/hyperlink.js"></script>
|
||||
<script src="spec/image.js"></script>
|
||||
<script src="spec/line.js"></script>
|
||||
<script src="spec/marker.js"></script>
|
||||
<script src="spec/mask.js"></script>
|
||||
<script src="spec/matrix.js"></script>
|
||||
<script src="spec/memory.js"></script>
|
||||
<script src="spec/nested.js"></script>
|
||||
<script src="spec/number.js"></script>
|
||||
<script src="spec/path.js"></script>
|
||||
<script src="spec/pattern.js"></script>
|
||||
<script src="spec/point.js"></script>
|
||||
<script src="spec/polygon.js"></script>
|
||||
<script src="spec/polyline.js"></script>
|
||||
<script src="spec/rect.js"></script>
|
||||
<script src="spec/regex.js"></script>
|
||||
<script src="spec/selector.js"></script>
|
||||
<script src="spec/set.js"></script>
|
||||
<script src="spec/sugar.js"></script>
|
||||
<script src="spec/svg.js"></script>
|
||||
<script src="spec/symbol.js"></script>
|
||||
<script src="spec/text.js"></script>
|
||||
<script src="spec/textpath.js"></script>
|
||||
<script src="spec/transformations.js"></script>
|
||||
<script src="spec/tspan.js"></script>
|
||||
<script src="spec/use.js"></script>
|
||||
<script src="spec/utils.js"></script>
|
||||
<script src="spec/viewbox.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
#drawing {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
position: fixed;
|
||||
z-index: -1;
|
||||
}
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
<svg height="0" width="0" id="inlineSVG">
|
||||
<defs>
|
||||
<linearGradient>
|
||||
<stop offset="5%" stop-color="green"/>
|
||||
<stop offset="95%" stop-color="gold"/>
|
||||
</linearGradient>
|
||||
<radialGradient>
|
||||
<stop offset="10%" stop-color="gold"/>
|
||||
<stop offset="95%" stop-color="green"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<desc>Some description</desc>
|
||||
<path id="lineAB" d="M 100 350 l 150 -300" stroke="red" stroke-width="3" fill="none" />
|
||||
<path id="lineBC" d="M 250 50 l 150 300" stroke="red" stroke-width="3" fill="none" />
|
||||
<path d="M 175 200 l 150 0" stroke="green" stroke-width="3" fill="none" />
|
||||
<path d="M 100 350 q 150 -300 300 0" stroke="blue" stroke-width="5" fill="none" />
|
||||
<g stroke="black" stroke-width="3" fill="black" id="pointGroup">
|
||||
<circle id="pointA" cx="100" cy="350" r="3" />
|
||||
<circle id="pointB" cx="250" cy="50" r="3" />
|
||||
<circle id="pointC" cx="400" cy="350" r="3" />
|
||||
</g>
|
||||
<g font-size="30" font="sans-serif" fill="black" stroke="none" text-anchor="middle" id="labelGroup">
|
||||
<text x="100" y="350" dx="-30">A</text>
|
||||
<text x="250" y="50" dy="-10">B</text>
|
||||
<text x="400" y="350" dx="30">C</text>
|
||||
</g>
|
||||
<polygon points="200,10 250,190 160,210" />
|
||||
<polyline points="20,20 40,25 60,40 80,120 120,140 200,180" />
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
BIN
Binary file not shown.
|
After Width: | Height: | Size: 119 B |
+133
@@ -0,0 +1,133 @@
|
||||
/**
|
||||
Starting with version 2.0, this file "boots" Jasmine, performing all of the necessary initialization before executing the loaded environment and all of a project's specs. This file should be loaded after `jasmine.js` and `jasmine_html.js`, but before any project source files or spec files are loaded. Thus this file can also be used to customize Jasmine for a project.
|
||||
|
||||
If a project is using Jasmine via the standalone distribution, this file can be customized directly. If a project is using Jasmine via the [Ruby gem][jasmine-gem], this file can be copied into the support directory via `jasmine copy_boot_js`. Other environments (e.g., Python) will have different mechanisms.
|
||||
|
||||
The location of `boot.js` can be specified and/or overridden in `jasmine.yml`.
|
||||
|
||||
[jasmine-gem]: http://github.com/pivotal/jasmine-gem
|
||||
*/
|
||||
|
||||
(function() {
|
||||
|
||||
/**
|
||||
* ## Require & Instantiate
|
||||
*
|
||||
* Require Jasmine's core files. Specifically, this requires and attaches all of Jasmine's code to the `jasmine` reference.
|
||||
*/
|
||||
window.jasmine = jasmineRequire.core(jasmineRequire);
|
||||
|
||||
/**
|
||||
* Since this is being run in a browser and the results should populate to an HTML page, require the HTML-specific Jasmine code, injecting the same reference.
|
||||
*/
|
||||
jasmineRequire.html(jasmine);
|
||||
|
||||
/**
|
||||
* Create the Jasmine environment. This is used to run all specs in a project.
|
||||
*/
|
||||
var env = jasmine.getEnv();
|
||||
|
||||
/**
|
||||
* ## The Global Interface
|
||||
*
|
||||
* Build up the functions that will be exposed as the Jasmine public interface. A project can customize, rename or alias any of these functions as desired, provided the implementation remains unchanged.
|
||||
*/
|
||||
var jasmineInterface = jasmineRequire.interface(jasmine, env);
|
||||
|
||||
/**
|
||||
* Add all of the Jasmine global/public interface to the global scope, so a project can use the public interface directly. For example, calling `describe` in specs instead of `jasmine.getEnv().describe`.
|
||||
*/
|
||||
extend(window, jasmineInterface);
|
||||
|
||||
/**
|
||||
* ## Runner Parameters
|
||||
*
|
||||
* More browser specific code - wrap the query string in an object and to allow for getting/setting parameters from the runner user interface.
|
||||
*/
|
||||
|
||||
var queryString = new jasmine.QueryString({
|
||||
getWindowLocation: function() { return window.location; }
|
||||
});
|
||||
|
||||
var filterSpecs = !!queryString.getParam("spec");
|
||||
|
||||
var catchingExceptions = queryString.getParam("catch");
|
||||
env.catchExceptions(typeof catchingExceptions === "undefined" ? true : catchingExceptions);
|
||||
|
||||
var throwingExpectationFailures = queryString.getParam("throwFailures");
|
||||
env.throwOnExpectationFailure(throwingExpectationFailures);
|
||||
|
||||
var random = queryString.getParam("random");
|
||||
env.randomizeTests(random);
|
||||
|
||||
var seed = queryString.getParam("seed");
|
||||
if (seed) {
|
||||
env.seed(seed);
|
||||
}
|
||||
|
||||
/**
|
||||
* ## Reporters
|
||||
* The `HtmlReporter` builds all of the HTML UI for the runner page. This reporter paints the dots, stars, and x's for specs, as well as all spec names and all failures (if any).
|
||||
*/
|
||||
var htmlReporter = new jasmine.HtmlReporter({
|
||||
env: env,
|
||||
onRaiseExceptionsClick: function() { queryString.navigateWithNewParam("catch", !env.catchingExceptions()); },
|
||||
onThrowExpectationsClick: function() { queryString.navigateWithNewParam("throwFailures", !env.throwingExpectationFailures()); },
|
||||
onRandomClick: function() { queryString.navigateWithNewParam("random", !env.randomTests()); },
|
||||
addToExistingQueryString: function(key, value) { return queryString.fullStringWithNewParam(key, value); },
|
||||
getContainer: function() { return document.body; },
|
||||
createElement: function() { return document.createElement.apply(document, arguments); },
|
||||
createTextNode: function() { return document.createTextNode.apply(document, arguments); },
|
||||
timer: new jasmine.Timer(),
|
||||
filterSpecs: filterSpecs
|
||||
});
|
||||
|
||||
/**
|
||||
* The `jsApiReporter` also receives spec results, and is used by any environment that needs to extract the results from JavaScript.
|
||||
*/
|
||||
env.addReporter(jasmineInterface.jsApiReporter);
|
||||
env.addReporter(htmlReporter);
|
||||
|
||||
/**
|
||||
* Filter which specs will be run by matching the start of the full name against the `spec` query param.
|
||||
*/
|
||||
var specFilter = new jasmine.HtmlSpecFilter({
|
||||
filterString: function() { return queryString.getParam("spec"); }
|
||||
});
|
||||
|
||||
env.specFilter = function(spec) {
|
||||
return specFilter.matches(spec.getFullName());
|
||||
};
|
||||
|
||||
/**
|
||||
* Setting up timing functions to be able to be overridden. Certain browsers (Safari, IE 8, phantomjs) require this hack.
|
||||
*/
|
||||
window.setTimeout = window.setTimeout;
|
||||
window.setInterval = window.setInterval;
|
||||
window.clearTimeout = window.clearTimeout;
|
||||
window.clearInterval = window.clearInterval;
|
||||
|
||||
/**
|
||||
* ## Execution
|
||||
*
|
||||
* Replace the browser window's `onload`, ensure it's called, and then run all of the loaded specs. This includes initializing the `HtmlReporter` instance and then executing the loaded Jasmine environment. All of this will happen after all of the specs are loaded.
|
||||
*/
|
||||
var currentWindowOnload = window.onload;
|
||||
|
||||
window.onload = function() {
|
||||
if (currentWindowOnload) {
|
||||
currentWindowOnload();
|
||||
}
|
||||
htmlReporter.initialize();
|
||||
env.execute();
|
||||
};
|
||||
|
||||
/**
|
||||
* Helper function for readability above.
|
||||
*/
|
||||
function extend(destination, source) {
|
||||
for (var property in source) destination[property] = source[property];
|
||||
return destination;
|
||||
}
|
||||
|
||||
}());
|
||||
+190
@@ -0,0 +1,190 @@
|
||||
/*
|
||||
Copyright (c) 2008-2017 Pivotal Labs
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
function getJasmineRequireObj() {
|
||||
if (typeof module !== 'undefined' && module.exports) {
|
||||
return exports;
|
||||
} else {
|
||||
window.jasmineRequire = window.jasmineRequire || {};
|
||||
return window.jasmineRequire;
|
||||
}
|
||||
}
|
||||
|
||||
getJasmineRequireObj().console = function(jRequire, j$) {
|
||||
j$.ConsoleReporter = jRequire.ConsoleReporter();
|
||||
};
|
||||
|
||||
getJasmineRequireObj().ConsoleReporter = function() {
|
||||
|
||||
var noopTimer = {
|
||||
start: function(){},
|
||||
elapsed: function(){ return 0; }
|
||||
};
|
||||
|
||||
function ConsoleReporter(options) {
|
||||
var print = options.print,
|
||||
showColors = options.showColors || false,
|
||||
onComplete = options.onComplete || function() {},
|
||||
timer = options.timer || noopTimer,
|
||||
specCount,
|
||||
failureCount,
|
||||
failedSpecs = [],
|
||||
pendingCount,
|
||||
ansi = {
|
||||
green: '\x1B[32m',
|
||||
red: '\x1B[31m',
|
||||
yellow: '\x1B[33m',
|
||||
none: '\x1B[0m'
|
||||
},
|
||||
failedSuites = [];
|
||||
|
||||
print('ConsoleReporter is deprecated and will be removed in a future version.');
|
||||
|
||||
this.jasmineStarted = function() {
|
||||
specCount = 0;
|
||||
failureCount = 0;
|
||||
pendingCount = 0;
|
||||
print('Started');
|
||||
printNewline();
|
||||
timer.start();
|
||||
};
|
||||
|
||||
this.jasmineDone = function() {
|
||||
printNewline();
|
||||
for (var i = 0; i < failedSpecs.length; i++) {
|
||||
specFailureDetails(failedSpecs[i]);
|
||||
}
|
||||
|
||||
if(specCount > 0) {
|
||||
printNewline();
|
||||
|
||||
var specCounts = specCount + ' ' + plural('spec', specCount) + ', ' +
|
||||
failureCount + ' ' + plural('failure', failureCount);
|
||||
|
||||
if (pendingCount) {
|
||||
specCounts += ', ' + pendingCount + ' pending ' + plural('spec', pendingCount);
|
||||
}
|
||||
|
||||
print(specCounts);
|
||||
} else {
|
||||
print('No specs found');
|
||||
}
|
||||
|
||||
printNewline();
|
||||
var seconds = timer.elapsed() / 1000;
|
||||
print('Finished in ' + seconds + ' ' + plural('second', seconds));
|
||||
printNewline();
|
||||
|
||||
for(i = 0; i < failedSuites.length; i++) {
|
||||
suiteFailureDetails(failedSuites[i]);
|
||||
}
|
||||
|
||||
onComplete(failureCount === 0);
|
||||
};
|
||||
|
||||
this.specDone = function(result) {
|
||||
specCount++;
|
||||
|
||||
if (result.status == 'pending') {
|
||||
pendingCount++;
|
||||
print(colored('yellow', '*'));
|
||||
return;
|
||||
}
|
||||
|
||||
if (result.status == 'passed') {
|
||||
print(colored('green', '.'));
|
||||
return;
|
||||
}
|
||||
|
||||
if (result.status == 'failed') {
|
||||
failureCount++;
|
||||
failedSpecs.push(result);
|
||||
print(colored('red', 'F'));
|
||||
}
|
||||
};
|
||||
|
||||
this.suiteDone = function(result) {
|
||||
if (result.failedExpectations && result.failedExpectations.length > 0) {
|
||||
failureCount++;
|
||||
failedSuites.push(result);
|
||||
}
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
function printNewline() {
|
||||
print('\n');
|
||||
}
|
||||
|
||||
function colored(color, str) {
|
||||
return showColors ? (ansi[color] + str + ansi.none) : str;
|
||||
}
|
||||
|
||||
function plural(str, count) {
|
||||
return count == 1 ? str : str + 's';
|
||||
}
|
||||
|
||||
function repeat(thing, times) {
|
||||
var arr = [];
|
||||
for (var i = 0; i < times; i++) {
|
||||
arr.push(thing);
|
||||
}
|
||||
return arr;
|
||||
}
|
||||
|
||||
function indent(str, spaces) {
|
||||
var lines = (str || '').split('\n');
|
||||
var newArr = [];
|
||||
for (var i = 0; i < lines.length; i++) {
|
||||
newArr.push(repeat(' ', spaces).join('') + lines[i]);
|
||||
}
|
||||
return newArr.join('\n');
|
||||
}
|
||||
|
||||
function specFailureDetails(result) {
|
||||
printNewline();
|
||||
print(result.fullName);
|
||||
|
||||
for (var i = 0; i < result.failedExpectations.length; i++) {
|
||||
var failedExpectation = result.failedExpectations[i];
|
||||
printNewline();
|
||||
print(indent(failedExpectation.message, 2));
|
||||
print(indent(failedExpectation.stack, 2));
|
||||
}
|
||||
|
||||
printNewline();
|
||||
}
|
||||
|
||||
function suiteFailureDetails(result) {
|
||||
for (var i = 0; i < result.failedExpectations.length; i++) {
|
||||
printNewline();
|
||||
print(colored('red', 'An error was thrown in an afterAll'));
|
||||
printNewline();
|
||||
print(colored('red', 'AfterAll ' + result.failedExpectations[i].message));
|
||||
|
||||
}
|
||||
printNewline();
|
||||
}
|
||||
}
|
||||
|
||||
return ConsoleReporter;
|
||||
};
|
||||
+499
@@ -0,0 +1,499 @@
|
||||
/*
|
||||
Copyright (c) 2008-2017 Pivotal Labs
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*/
|
||||
jasmineRequire.html = function(j$) {
|
||||
j$.ResultsNode = jasmineRequire.ResultsNode();
|
||||
j$.HtmlReporter = jasmineRequire.HtmlReporter(j$);
|
||||
j$.QueryString = jasmineRequire.QueryString();
|
||||
j$.HtmlSpecFilter = jasmineRequire.HtmlSpecFilter();
|
||||
};
|
||||
|
||||
jasmineRequire.HtmlReporter = function(j$) {
|
||||
|
||||
var noopTimer = {
|
||||
start: function() {},
|
||||
elapsed: function() { return 0; }
|
||||
};
|
||||
|
||||
function HtmlReporter(options) {
|
||||
var env = options.env || {},
|
||||
getContainer = options.getContainer,
|
||||
createElement = options.createElement,
|
||||
createTextNode = options.createTextNode,
|
||||
onRaiseExceptionsClick = options.onRaiseExceptionsClick || function() {},
|
||||
onThrowExpectationsClick = options.onThrowExpectationsClick || function() {},
|
||||
onRandomClick = options.onRandomClick || function() {},
|
||||
addToExistingQueryString = options.addToExistingQueryString || defaultQueryString,
|
||||
filterSpecs = options.filterSpecs,
|
||||
timer = options.timer || noopTimer,
|
||||
results = [],
|
||||
specsExecuted = 0,
|
||||
failureCount = 0,
|
||||
pendingSpecCount = 0,
|
||||
htmlReporterMain,
|
||||
symbols,
|
||||
failedSuites = [];
|
||||
|
||||
this.initialize = function() {
|
||||
clearPrior();
|
||||
htmlReporterMain = createDom('div', {className: 'jasmine_html-reporter'},
|
||||
createDom('div', {className: 'jasmine-banner'},
|
||||
createDom('a', {className: 'jasmine-title', href: 'http://jasmine.github.io/', target: '_blank'}),
|
||||
createDom('span', {className: 'jasmine-version'}, j$.version)
|
||||
),
|
||||
createDom('ul', {className: 'jasmine-symbol-summary'}),
|
||||
createDom('div', {className: 'jasmine-alert'}),
|
||||
createDom('div', {className: 'jasmine-results'},
|
||||
createDom('div', {className: 'jasmine-failures'})
|
||||
)
|
||||
);
|
||||
getContainer().appendChild(htmlReporterMain);
|
||||
};
|
||||
|
||||
var totalSpecsDefined;
|
||||
this.jasmineStarted = function(options) {
|
||||
totalSpecsDefined = options.totalSpecsDefined || 0;
|
||||
timer.start();
|
||||
};
|
||||
|
||||
var summary = createDom('div', {className: 'jasmine-summary'});
|
||||
|
||||
var topResults = new j$.ResultsNode({}, '', null),
|
||||
currentParent = topResults;
|
||||
|
||||
this.suiteStarted = function(result) {
|
||||
currentParent.addChild(result, 'suite');
|
||||
currentParent = currentParent.last();
|
||||
};
|
||||
|
||||
this.suiteDone = function(result) {
|
||||
if (result.status == 'failed') {
|
||||
failedSuites.push(result);
|
||||
}
|
||||
|
||||
if (currentParent == topResults) {
|
||||
return;
|
||||
}
|
||||
|
||||
currentParent = currentParent.parent;
|
||||
};
|
||||
|
||||
this.specStarted = function(result) {
|
||||
currentParent.addChild(result, 'spec');
|
||||
};
|
||||
|
||||
var failures = [];
|
||||
this.specDone = function(result) {
|
||||
if(noExpectations(result) && typeof console !== 'undefined' && typeof console.error !== 'undefined') {
|
||||
console.error('Spec \'' + result.fullName + '\' has no expectations.');
|
||||
}
|
||||
|
||||
if (result.status != 'disabled') {
|
||||
specsExecuted++;
|
||||
}
|
||||
|
||||
if (!symbols){
|
||||
symbols = find('.jasmine-symbol-summary');
|
||||
}
|
||||
|
||||
symbols.appendChild(createDom('li', {
|
||||
className: noExpectations(result) ? 'jasmine-empty' : 'jasmine-' + result.status,
|
||||
id: 'spec_' + result.id,
|
||||
title: result.fullName
|
||||
}
|
||||
));
|
||||
|
||||
if (result.status == 'failed') {
|
||||
failureCount++;
|
||||
|
||||
var failure =
|
||||
createDom('div', {className: 'jasmine-spec-detail jasmine-failed'},
|
||||
createDom('div', {className: 'jasmine-description'},
|
||||
createDom('a', {title: result.fullName, href: specHref(result)}, result.fullName)
|
||||
),
|
||||
createDom('div', {className: 'jasmine-messages'})
|
||||
);
|
||||
var messages = failure.childNodes[1];
|
||||
|
||||
for (var i = 0; i < result.failedExpectations.length; i++) {
|
||||
var expectation = result.failedExpectations[i];
|
||||
messages.appendChild(createDom('div', {className: 'jasmine-result-message'}, expectation.message));
|
||||
messages.appendChild(createDom('div', {className: 'jasmine-stack-trace'}, expectation.stack));
|
||||
}
|
||||
|
||||
failures.push(failure);
|
||||
}
|
||||
|
||||
if (result.status == 'pending') {
|
||||
pendingSpecCount++;
|
||||
}
|
||||
};
|
||||
|
||||
this.jasmineDone = function(doneResult) {
|
||||
var banner = find('.jasmine-banner');
|
||||
var alert = find('.jasmine-alert');
|
||||
var order = doneResult && doneResult.order;
|
||||
alert.appendChild(createDom('span', {className: 'jasmine-duration'}, 'finished in ' + timer.elapsed() / 1000 + 's'));
|
||||
|
||||
banner.appendChild(
|
||||
createDom('div', { className: 'jasmine-run-options' },
|
||||
createDom('span', { className: 'jasmine-trigger' }, 'Options'),
|
||||
createDom('div', { className: 'jasmine-payload' },
|
||||
createDom('div', { className: 'jasmine-exceptions' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-raise',
|
||||
id: 'jasmine-raise-exceptions',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom('label', { className: 'jasmine-label', 'for': 'jasmine-raise-exceptions' }, 'raise exceptions')),
|
||||
createDom('div', { className: 'jasmine-throw-failures' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-throw',
|
||||
id: 'jasmine-throw-failures',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom('label', { className: 'jasmine-label', 'for': 'jasmine-throw-failures' }, 'stop spec on expectation failure')),
|
||||
createDom('div', { className: 'jasmine-random-order' },
|
||||
createDom('input', {
|
||||
className: 'jasmine-random',
|
||||
id: 'jasmine-random-order',
|
||||
type: 'checkbox'
|
||||
}),
|
||||
createDom('label', { className: 'jasmine-label', 'for': 'jasmine-random-order' }, 'run tests in random order'))
|
||||
)
|
||||
));
|
||||
|
||||
var raiseCheckbox = find('#jasmine-raise-exceptions');
|
||||
|
||||
raiseCheckbox.checked = !env.catchingExceptions();
|
||||
raiseCheckbox.onclick = onRaiseExceptionsClick;
|
||||
|
||||
var throwCheckbox = find('#jasmine-throw-failures');
|
||||
throwCheckbox.checked = env.throwingExpectationFailures();
|
||||
throwCheckbox.onclick = onThrowExpectationsClick;
|
||||
|
||||
var randomCheckbox = find('#jasmine-random-order');
|
||||
randomCheckbox.checked = env.randomTests();
|
||||
randomCheckbox.onclick = onRandomClick;
|
||||
|
||||
var optionsMenu = find('.jasmine-run-options'),
|
||||
optionsTrigger = optionsMenu.querySelector('.jasmine-trigger'),
|
||||
optionsPayload = optionsMenu.querySelector('.jasmine-payload'),
|
||||
isOpen = /\bjasmine-open\b/;
|
||||
|
||||
optionsTrigger.onclick = function() {
|
||||
if (isOpen.test(optionsPayload.className)) {
|
||||
optionsPayload.className = optionsPayload.className.replace(isOpen, '');
|
||||
} else {
|
||||
optionsPayload.className += ' jasmine-open';
|
||||
}
|
||||
};
|
||||
|
||||
if (specsExecuted < totalSpecsDefined) {
|
||||
var skippedMessage = 'Ran ' + specsExecuted + ' of ' + totalSpecsDefined + ' specs - run all';
|
||||
var skippedLink = order && order.random ? '?random=true' : '?';
|
||||
alert.appendChild(
|
||||
createDom('span', {className: 'jasmine-bar jasmine-skipped'},
|
||||
createDom('a', {href: skippedLink, title: 'Run all specs'}, skippedMessage)
|
||||
)
|
||||
);
|
||||
}
|
||||
var statusBarMessage = '';
|
||||
var statusBarClassName = 'jasmine-bar ';
|
||||
|
||||
if (totalSpecsDefined > 0) {
|
||||
statusBarMessage += pluralize('spec', specsExecuted) + ', ' + pluralize('failure', failureCount);
|
||||
if (pendingSpecCount) { statusBarMessage += ', ' + pluralize('pending spec', pendingSpecCount); }
|
||||
statusBarClassName += (failureCount > 0) ? 'jasmine-failed' : 'jasmine-passed';
|
||||
} else {
|
||||
statusBarClassName += 'jasmine-skipped';
|
||||
statusBarMessage += 'No specs found';
|
||||
}
|
||||
|
||||
var seedBar;
|
||||
if (order && order.random) {
|
||||
seedBar = createDom('span', {className: 'jasmine-seed-bar'},
|
||||
', randomized with seed ',
|
||||
createDom('a', {title: 'randomized with seed ' + order.seed, href: seedHref(order.seed)}, order.seed)
|
||||
);
|
||||
}
|
||||
|
||||
alert.appendChild(createDom('span', {className: statusBarClassName}, statusBarMessage, seedBar));
|
||||
|
||||
var errorBarClassName = 'jasmine-bar jasmine-errored';
|
||||
var errorBarMessagePrefix = 'AfterAll ';
|
||||
|
||||
for(var i = 0; i < failedSuites.length; i++) {
|
||||
var failedSuite = failedSuites[i];
|
||||
for(var j = 0; j < failedSuite.failedExpectations.length; j++) {
|
||||
alert.appendChild(createDom('span', {className: errorBarClassName}, errorBarMessagePrefix + failedSuite.failedExpectations[j].message));
|
||||
}
|
||||
}
|
||||
|
||||
var globalFailures = (doneResult && doneResult.failedExpectations) || [];
|
||||
for(i = 0; i < globalFailures.length; i++) {
|
||||
var failure = globalFailures[i];
|
||||
alert.appendChild(createDom('span', {className: errorBarClassName}, errorBarMessagePrefix + failure.message));
|
||||
}
|
||||
|
||||
var results = find('.jasmine-results');
|
||||
results.appendChild(summary);
|
||||
|
||||
summaryList(topResults, summary);
|
||||
|
||||
function summaryList(resultsTree, domParent) {
|
||||
var specListNode;
|
||||
for (var i = 0; i < resultsTree.children.length; i++) {
|
||||
var resultNode = resultsTree.children[i];
|
||||
if (filterSpecs && !hasActiveSpec(resultNode)) {
|
||||
continue;
|
||||
}
|
||||
if (resultNode.type == 'suite') {
|
||||
var suiteListNode = createDom('ul', {className: 'jasmine-suite', id: 'suite-' + resultNode.result.id},
|
||||
createDom('li', {className: 'jasmine-suite-detail'},
|
||||
createDom('a', {href: specHref(resultNode.result)}, resultNode.result.description)
|
||||
)
|
||||
);
|
||||
|
||||
summaryList(resultNode, suiteListNode);
|
||||
domParent.appendChild(suiteListNode);
|
||||
}
|
||||
if (resultNode.type == 'spec') {
|
||||
if (domParent.getAttribute('class') != 'jasmine-specs') {
|
||||
specListNode = createDom('ul', {className: 'jasmine-specs'});
|
||||
domParent.appendChild(specListNode);
|
||||
}
|
||||
var specDescription = resultNode.result.description;
|
||||
if(noExpectations(resultNode.result)) {
|
||||
specDescription = 'SPEC HAS NO EXPECTATIONS ' + specDescription;
|
||||
}
|
||||
if(resultNode.result.status === 'pending' && resultNode.result.pendingReason !== '') {
|
||||
specDescription = specDescription + ' PENDING WITH MESSAGE: ' + resultNode.result.pendingReason;
|
||||
}
|
||||
specListNode.appendChild(
|
||||
createDom('li', {
|
||||
className: 'jasmine-' + resultNode.result.status,
|
||||
id: 'spec-' + resultNode.result.id
|
||||
},
|
||||
createDom('a', {href: specHref(resultNode.result)}, specDescription)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (failures.length) {
|
||||
alert.appendChild(
|
||||
createDom('span', {className: 'jasmine-menu jasmine-bar jasmine-spec-list'},
|
||||
createDom('span', {}, 'Spec List | '),
|
||||
createDom('a', {className: 'jasmine-failures-menu', href: '#'}, 'Failures')));
|
||||
alert.appendChild(
|
||||
createDom('span', {className: 'jasmine-menu jasmine-bar jasmine-failure-list'},
|
||||
createDom('a', {className: 'jasmine-spec-list-menu', href: '#'}, 'Spec List'),
|
||||
createDom('span', {}, ' | Failures ')));
|
||||
|
||||
find('.jasmine-failures-menu').onclick = function() {
|
||||
setMenuModeTo('jasmine-failure-list');
|
||||
};
|
||||
find('.jasmine-spec-list-menu').onclick = function() {
|
||||
setMenuModeTo('jasmine-spec-list');
|
||||
};
|
||||
|
||||
setMenuModeTo('jasmine-failure-list');
|
||||
|
||||
var failureNode = find('.jasmine-failures');
|
||||
for (i = 0; i < failures.length; i++) {
|
||||
failureNode.appendChild(failures[i]);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
function find(selector) {
|
||||
return getContainer().querySelector('.jasmine_html-reporter ' + selector);
|
||||
}
|
||||
|
||||
function clearPrior() {
|
||||
// return the reporter
|
||||
var oldReporter = find('');
|
||||
|
||||
if(oldReporter) {
|
||||
getContainer().removeChild(oldReporter);
|
||||
}
|
||||
}
|
||||
|
||||
function createDom(type, attrs, childrenVarArgs) {
|
||||
var el = createElement(type);
|
||||
|
||||
for (var i = 2; i < arguments.length; i++) {
|
||||
var child = arguments[i];
|
||||
|
||||
if (typeof child === 'string') {
|
||||
el.appendChild(createTextNode(child));
|
||||
} else {
|
||||
if (child) {
|
||||
el.appendChild(child);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (var attr in attrs) {
|
||||
if (attr == 'className') {
|
||||
el[attr] = attrs[attr];
|
||||
} else {
|
||||
el.setAttribute(attr, attrs[attr]);
|
||||
}
|
||||
}
|
||||
|
||||
return el;
|
||||
}
|
||||
|
||||
function pluralize(singular, count) {
|
||||
var word = (count == 1 ? singular : singular + 's');
|
||||
|
||||
return '' + count + ' ' + word;
|
||||
}
|
||||
|
||||
function specHref(result) {
|
||||
return addToExistingQueryString('spec', result.fullName);
|
||||
}
|
||||
|
||||
function seedHref(seed) {
|
||||
return addToExistingQueryString('seed', seed);
|
||||
}
|
||||
|
||||
function defaultQueryString(key, value) {
|
||||
return '?' + key + '=' + value;
|
||||
}
|
||||
|
||||
function setMenuModeTo(mode) {
|
||||
htmlReporterMain.setAttribute('class', 'jasmine_html-reporter ' + mode);
|
||||
}
|
||||
|
||||
function noExpectations(result) {
|
||||
return (result.failedExpectations.length + result.passedExpectations.length) === 0 &&
|
||||
result.status === 'passed';
|
||||
}
|
||||
|
||||
function hasActiveSpec(resultNode) {
|
||||
if (resultNode.type == 'spec' && resultNode.result.status != 'disabled') {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (resultNode.type == 'suite') {
|
||||
for (var i = 0, j = resultNode.children.length; i < j; i++) {
|
||||
if (hasActiveSpec(resultNode.children[i])) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return HtmlReporter;
|
||||
};
|
||||
|
||||
jasmineRequire.HtmlSpecFilter = function() {
|
||||
function HtmlSpecFilter(options) {
|
||||
var filterString = options && options.filterString() && options.filterString().replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
|
||||
var filterPattern = new RegExp(filterString);
|
||||
|
||||
this.matches = function(specName) {
|
||||
return filterPattern.test(specName);
|
||||
};
|
||||
}
|
||||
|
||||
return HtmlSpecFilter;
|
||||
};
|
||||
|
||||
jasmineRequire.ResultsNode = function() {
|
||||
function ResultsNode(result, type, parent) {
|
||||
this.result = result;
|
||||
this.type = type;
|
||||
this.parent = parent;
|
||||
|
||||
this.children = [];
|
||||
|
||||
this.addChild = function(result, type) {
|
||||
this.children.push(new ResultsNode(result, type, this));
|
||||
};
|
||||
|
||||
this.last = function() {
|
||||
return this.children[this.children.length - 1];
|
||||
};
|
||||
}
|
||||
|
||||
return ResultsNode;
|
||||
};
|
||||
|
||||
jasmineRequire.QueryString = function() {
|
||||
function QueryString(options) {
|
||||
|
||||
this.navigateWithNewParam = function(key, value) {
|
||||
options.getWindowLocation().search = this.fullStringWithNewParam(key, value);
|
||||
};
|
||||
|
||||
this.fullStringWithNewParam = function(key, value) {
|
||||
var paramMap = queryStringToParamMap();
|
||||
paramMap[key] = value;
|
||||
return toQueryString(paramMap);
|
||||
};
|
||||
|
||||
this.getParam = function(key) {
|
||||
return queryStringToParamMap()[key];
|
||||
};
|
||||
|
||||
return this;
|
||||
|
||||
function toQueryString(paramMap) {
|
||||
var qStrPairs = [];
|
||||
for (var prop in paramMap) {
|
||||
qStrPairs.push(encodeURIComponent(prop) + '=' + encodeURIComponent(paramMap[prop]));
|
||||
}
|
||||
return '?' + qStrPairs.join('&');
|
||||
}
|
||||
|
||||
function queryStringToParamMap() {
|
||||
var paramStr = options.getWindowLocation().search.substring(1),
|
||||
params = [],
|
||||
paramMap = {};
|
||||
|
||||
if (paramStr.length > 0) {
|
||||
params = paramStr.split('&');
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
var p = params[i].split('=');
|
||||
var value = decodeURIComponent(p[1]);
|
||||
if (value === 'true' || value === 'false') {
|
||||
value = JSON.parse(value);
|
||||
}
|
||||
paramMap[decodeURIComponent(p[0])] = value;
|
||||
}
|
||||
}
|
||||
|
||||
return paramMap;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return QueryString;
|
||||
};
|
||||
+58
File diff suppressed because one or more lines are too long
+4943
File diff suppressed because it is too large
Load Diff
BIN
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
+81
@@ -0,0 +1,81 @@
|
||||
describe('Adopter', function() {
|
||||
var path, polyline, polygon, linearGradient, radialGradient
|
||||
|
||||
beforeEach(function() {
|
||||
path = SVG.get('lineAB')
|
||||
polyline = SVG.get('inlineSVG').select('polyline').first()
|
||||
polygon = SVG.get('inlineSVG').select('polygon').first()
|
||||
linearGradient = SVG.get('inlineSVG').select('linearGradient').first()
|
||||
radialGradient = SVG.get('inlineSVG').select('radialGradient').first()
|
||||
})
|
||||
|
||||
describe('with SVG.Doc instance', function() {
|
||||
it('adopts the main svg document when parent() method is called on first level children', function() {
|
||||
expect(path.parent() instanceof SVG.Doc).toBeTruthy()
|
||||
})
|
||||
it('defines a xmlns attribute', function() {
|
||||
expect(path.parent().node.getAttribute('xmlns')).toBe(SVG.ns)
|
||||
})
|
||||
it('defines a version attribute', function() {
|
||||
expect(path.parent().node.getAttribute('version')).toBe('1.1')
|
||||
})
|
||||
it('defines a xmlns:xlink attribute', function() {
|
||||
expect(path.parent().node.getAttribute('xmlns:xlink')).toBe(SVG.xlink)
|
||||
})
|
||||
it('initializes a defs node', function() {
|
||||
expect(path.parent()._defs).toBe(path.parent().defs())
|
||||
})
|
||||
})
|
||||
|
||||
describe('with SVG.Path instance', function() {
|
||||
it('adopts an exiting path element', function() {
|
||||
expect(path instanceof SVG.Path).toBeTruthy()
|
||||
})
|
||||
it('modifies an adopted element', function() {
|
||||
path.fill('#f06')
|
||||
expect(path.node.getAttribute('fill')).toBe('#ff0066')
|
||||
})
|
||||
it('parses d attribute to SVG.PathArray', function() {
|
||||
expect(path.array() instanceof SVG.PathArray).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('with SVG.Polyline instance', function() {
|
||||
it('parses points attribute to SVG.PointArray', function() {
|
||||
expect(polyline.array() instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('with SVG.Polygon instance', function() {
|
||||
it('parses points attribute to SVG.PointArray', function() {
|
||||
expect(polygon.array() instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('with linear SVG.Gradient instance', function() {
|
||||
it('is instance of SVG.Gradient', function() {
|
||||
expect(linearGradient instanceof SVG.Gradient).toBeTruthy()
|
||||
})
|
||||
it('has type of linear', function() {
|
||||
expect(linearGradient.type).toBe('linearGradient') // actually it should be 'linear'. see #606
|
||||
})
|
||||
})
|
||||
|
||||
describe('with radial SVG.Gradient instance', function() {
|
||||
it('is instance of SVG.Gradient', function() {
|
||||
expect(radialGradient instanceof SVG.Gradient).toBeTruthy()
|
||||
})
|
||||
it('has type of radial', function() {
|
||||
expect(radialGradient.type).toBe('radialGradient') // actually it should be 'radial'. see #606
|
||||
})
|
||||
})
|
||||
|
||||
describe('with node that has no matching svg.js class', function() {
|
||||
it('wraps the node in the base SVG.Element class', function() {
|
||||
var desc = SVG.get('inlineSVG').select('desc').first()
|
||||
expect(desc instanceof SVG.Element).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
})
|
||||
+185
@@ -0,0 +1,185 @@
|
||||
describe('Arrange', function() {
|
||||
var e1, e2, e3
|
||||
|
||||
beforeEach(function() {
|
||||
draw.clear()
|
||||
|
||||
e1 = draw.rect(100,100).move(10,10).attr('id', 'e1')
|
||||
e2 = draw.ellipse(100,100).move(20,20).attr('id', 'e2')
|
||||
e3 = draw.line(0,0,100,100).move(30,30).attr('id', 'e3')
|
||||
})
|
||||
|
||||
describe('siblings()', function() {
|
||||
it('returns all siblings of targeted element', function() {
|
||||
expect(e1.siblings().length).toBe(3+parserInDoc)
|
||||
expect(parser.concat([e1,e2,e3])).toEqual(e2.siblings())
|
||||
})
|
||||
})
|
||||
|
||||
describe('position()', function() {
|
||||
it('returns the index position within it\'s parent', function() {
|
||||
expect(e1.siblings().length).toBe(3+parserInDoc)
|
||||
expect(e1.position()).toBe(0+parserInDoc)
|
||||
expect(e2.position()).toBe(1+parserInDoc)
|
||||
expect(e3.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
})
|
||||
|
||||
describe('next()', function() {
|
||||
it('returns the next sibling within the parent element', function() {
|
||||
expect(e1.next()).toBe(e2)
|
||||
expect(e2.next()).toBe(e3)
|
||||
expect(e3.next()).toBe(undefined)
|
||||
})
|
||||
})
|
||||
|
||||
describe('previous()', function() {
|
||||
it('returns the previous sibling within the parent element', function() {
|
||||
expect(e1.previous()).toBe(parser[0])
|
||||
expect(e2.previous()).toBe(e1)
|
||||
expect(e3.previous()).toBe(e2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('forward()', function() {
|
||||
it('returns the element itself', function() {
|
||||
expect(e1.forward()).toBe(e1)
|
||||
})
|
||||
it('moves the element one step forward within its parent', function() {
|
||||
e1.forward()
|
||||
expect(e1.position()).toBe(1+parserInDoc)
|
||||
expect(e2.position()).toBe(0+parserInDoc)
|
||||
expect(e3.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
it('keeps the last element at the same position', function() {
|
||||
e3.forward()
|
||||
expect(e3.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
it('keeps the defs on top of the stack', function() {
|
||||
draw.defs()
|
||||
e3.forward()
|
||||
expect(draw.node.childNodes[2+parserInDoc]).toBe(e3.node)
|
||||
expect(draw.node.childNodes[3+parserInDoc]).toBe(draw.defs().node)
|
||||
})
|
||||
})
|
||||
|
||||
describe('backward()', function() {
|
||||
it('returns the element itself', function() {
|
||||
if(parserInDoc){
|
||||
expect(parser[0].backward()).toBe(parser[0])
|
||||
}else{
|
||||
expect(e1.backward()).toBe(e1)
|
||||
}
|
||||
})
|
||||
it('moves the element one step backwards within its parent', function() {
|
||||
e3.backward()
|
||||
expect(e1.position()).toBe(0+parserInDoc)
|
||||
expect(e2.position()).toBe(2+parserInDoc)
|
||||
expect(e3.position()).toBe(1+parserInDoc)
|
||||
})
|
||||
it('keeps the first element at the same position', function() {
|
||||
e3.backward()
|
||||
expect(e1.position()).toBe(0+parserInDoc)
|
||||
})
|
||||
})
|
||||
|
||||
describe('front()', function() {
|
||||
it('returns the element itself', function() {
|
||||
expect(e3.front()).toBe(e3)
|
||||
})
|
||||
it('moves the element to the top of the stack within its parent', function() {
|
||||
e1.front()
|
||||
expect(e1.position()).toBe(2+parserInDoc)
|
||||
expect(e2.position()).toBe(0+parserInDoc)
|
||||
expect(e3.position()).toBe(1+parserInDoc)
|
||||
})
|
||||
it('keeps the last element at the same position', function() {
|
||||
e3.front()
|
||||
expect(e3.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
it('keeps the defs on top of the stack', function() {
|
||||
e1.front()
|
||||
expect(draw.node.childNodes[2+parserInDoc]).toBe(e1.node)
|
||||
expect(draw.node.childNodes[3+parserInDoc]).toBe(draw.defs().node)
|
||||
})
|
||||
})
|
||||
|
||||
describe('back()', function() {
|
||||
it('returns the element itself', function() {
|
||||
expect(e3.back()).toBe(e3)
|
||||
})
|
||||
it('moves the element to the bottom of the stack within its parent', function() {
|
||||
e3.back()
|
||||
expect(e1.position()).toBe(1+parserInDoc)
|
||||
expect(e2.position()).toBe(2+parserInDoc)
|
||||
expect(e3.position()).toBe(0)
|
||||
})
|
||||
it('keeps the first element at the same position', function() {
|
||||
e1.back()
|
||||
expect(e1.position()).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('before()', function() {
|
||||
it('returns the targeted element itself', function() {
|
||||
expect(e3.before(e1)).toBe(e3)
|
||||
})
|
||||
it('inserts a given element before the targeted element', function() {
|
||||
e3.before(e1)
|
||||
expect(e1.position()).toBe(1+parserInDoc)
|
||||
expect(e2.position()).toBe(0+parserInDoc)
|
||||
expect(e3.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
it('moves elements between containers', function() {
|
||||
var group = draw.group()
|
||||
, e4 = group.rect(80,120)
|
||||
, e5 = group.rect(80,120)
|
||||
, e6 = group.rect(80,120)
|
||||
|
||||
e2.before(e5)
|
||||
expect(e1.position()).toBe(0+parserInDoc)
|
||||
expect(e2.position()).toBe(2+parserInDoc)
|
||||
expect(e3.position()).toBe(3+parserInDoc)
|
||||
expect(e5.position()).toBe(1+parserInDoc)
|
||||
})
|
||||
})
|
||||
|
||||
describe('after()', function() {
|
||||
it('returns the targeted element itself', function() {
|
||||
expect(e3.after(e1)).toBe(e3)
|
||||
})
|
||||
it('inserts a given element after the targeted element', function() {
|
||||
e3.after(e1)
|
||||
expect(e1.position()).toBe(2+parserInDoc)
|
||||
expect(e2.position()).toBe(0+parserInDoc)
|
||||
expect(e3.position()).toBe(1+parserInDoc)
|
||||
})
|
||||
it('moves elements between containers', function() {
|
||||
var group = draw.group()
|
||||
, e4 = group.rect(80,120)
|
||||
, e5 = group.rect(80,120)
|
||||
, e6 = group.rect(80,120)
|
||||
|
||||
e2.after(e5)
|
||||
expect(e1.position()).toBe(0+parserInDoc)
|
||||
expect(e2.position()).toBe(1+parserInDoc)
|
||||
expect(e3.position()).toBe(3+parserInDoc)
|
||||
expect(e5.position()).toBe(2+parserInDoc)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+420
@@ -0,0 +1,420 @@
|
||||
describe('Array', function () {
|
||||
var array, arr1, arr2
|
||||
|
||||
it('parses a matrix array correctly to string', function() {
|
||||
array = new SVG.Array([ .343, .669, .119, 0, 0
|
||||
, .249, -.626, .130, 0, 0
|
||||
, .172, .334, .111, 0, 0
|
||||
, .000, .000, .000, 1, -0 ])
|
||||
|
||||
expect(array + '').toBe('0.343 0.669 0.119 0 0 0.249 -0.626 0.13 0 0 0.172 0.334 0.111 0 0 0 0 0 1 0')
|
||||
})
|
||||
it('parses space seperated string and converts it to array', function() {
|
||||
expect((new SVG.Array('1 2 3 4')).value).toEqual([1,2,3,4])
|
||||
})
|
||||
it('parses comma seperated string and converts it to array', function() {
|
||||
expect((new SVG.Array('1,2,3,4')).value).toEqual([1,2,3,4])
|
||||
})
|
||||
describe('reverse()', function() {
|
||||
it('reverses the array', function() {
|
||||
array = new SVG.Array([1 ,2 ,3, 4, 5]).reverse()
|
||||
expect(array.value).toEqual([5, 4, 3, 2, 1])
|
||||
})
|
||||
it('returns itself', function() {
|
||||
array = new SVG.Array()
|
||||
expect(array.reverse()).toBe(array)
|
||||
})
|
||||
})
|
||||
describe('clone()', function() {
|
||||
it('creates a deep clone of the array', function() {
|
||||
array = new SVG.Array([1, 2, 3, 4, 5])
|
||||
|
||||
clone = array.clone()
|
||||
|
||||
expect(array).toEqual(clone)
|
||||
expect(array).not.toBe(clone)
|
||||
|
||||
array = new SVG.Array([[1,2], [3, 4], [5]])
|
||||
clone = array.clone()
|
||||
|
||||
expect(array).toEqual(array)
|
||||
for(var i = 0, len = array.value.length; i; ++i){
|
||||
expect(array[i]).not.toBe(clone[i])
|
||||
}
|
||||
})
|
||||
it('also works with PointArray', function() {
|
||||
array = new SVG.PointArray([1,2,3,4,5,6])
|
||||
clone = array.clone()
|
||||
|
||||
expect(array).toEqual(clone)
|
||||
expect(array).not.toBe(clone)
|
||||
|
||||
for(var i = 0, len = array.value.length; i; ++i){
|
||||
expect(array[i]).not.toBe(clone[i])
|
||||
}
|
||||
})
|
||||
it('also works with PathArray', function() {
|
||||
array = new SVG.PathArray([['M',1,2],['L',3,4],['L',5,6]])
|
||||
clone = array.clone()
|
||||
|
||||
expect(array).toEqual(clone)
|
||||
expect(array).not.toBe(clone)
|
||||
|
||||
for(var i = 0, len = array.value.length; i; ++i){
|
||||
expect(array[i]).not.toBe(clone[i])
|
||||
}
|
||||
})
|
||||
})
|
||||
describe('morph()', function() {
|
||||
it('adds entries so that destination array has equal length', function() {
|
||||
|
||||
arr1 = new SVG.Array([1,2,3,4,5])
|
||||
arr2 = new SVG.Array([1,2,3,4])
|
||||
|
||||
arr1.morph(arr2)
|
||||
|
||||
expect(arr1.destination.length).toBe(arr1.value.length)
|
||||
})
|
||||
it('does the same the other way round', function() {
|
||||
|
||||
arr1 = new SVG.Array([1,2,3,4])
|
||||
arr2 = new SVG.Array([1,2,3,4,5])
|
||||
|
||||
arr1.morph(arr2)
|
||||
|
||||
expect(arr1.destination.length).toBe(arr1.value.length)
|
||||
})
|
||||
})
|
||||
describe('settle()', function() {
|
||||
it('cleans up any duplicate value', function() {
|
||||
array = new SVG.Array([1,2,3,4,5,4,3,2,1])
|
||||
expect(array.settle().sort()).toEqual([1,2,3,4,5].sort())
|
||||
})
|
||||
})
|
||||
describe('at()', function() {
|
||||
beforeEach(function() {
|
||||
arr1 = new SVG.Array([1,2,3,4])
|
||||
arr2 = new SVG.Array([2,3,4,5])
|
||||
})
|
||||
|
||||
it('returns a new array instance', function() {
|
||||
arr1.morph(arr2)
|
||||
|
||||
start = arr1.at(0)
|
||||
end = arr1.at(1)
|
||||
|
||||
expect(start instanceof SVG.Array).toBeTruthy()
|
||||
expect(start).not.toBe(arr1)
|
||||
|
||||
expect(end instanceof SVG.Array).toBeTruthy()
|
||||
expect(end).not.toBe(arr2)
|
||||
})
|
||||
it('morphs all values of the array', function() {
|
||||
arr1.morph(arr2)
|
||||
expect(arr1.at(0.5).value).toEqual([1.5, 2.5, 3.5, 4.5])
|
||||
})
|
||||
it('returns itself if no destination was specified', function() {
|
||||
expect(arr1.at(0.5)).toBe(arr1)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('PointArray', function () {
|
||||
it('parses a string to a point array', function() {
|
||||
var array = new SVG.PointArray('0,1 -.05,7.95 1000.0001,-200.222')
|
||||
|
||||
expect(array.valueOf()).toEqual([[0, 1], [-0.05, 7.95], [1000.0001, -200.222]])
|
||||
})
|
||||
it('parses a points array correctly to string', function() {
|
||||
var array = new SVG.PointArray([[0,.15], [-100,-3.141592654], [50,100]])
|
||||
|
||||
expect(array + '').toBe('0,0.15 -100,-3.141592654 50,100')
|
||||
})
|
||||
it('parses a flat array of x/y coordinates to a point array', function() {
|
||||
var array = new SVG.PointArray([1,4, 5,68, 12,24])
|
||||
|
||||
expect(array.value).toEqual([[1,4], [5,68], [12,24]])
|
||||
})
|
||||
it('parses an array of arrays correctly', function () {
|
||||
var array = new SVG.PointArray([[1,4], [5,68], [12,24]])
|
||||
|
||||
expect(array.value).toEqual([[1,4], [5,68], [12,24]])
|
||||
})
|
||||
it('copies array if necessary', function () {
|
||||
var arr = [[1,4], [5,68], [12,24]]
|
||||
var array = new SVG.PointArray(arr)
|
||||
|
||||
expect(array.valueOf()).not.toBe(arr)
|
||||
})
|
||||
it('parses an array of point objects correctly', function () {
|
||||
var array = new SVG.PointArray([{x:1,y:4}, {x:5,y:68}, {x:12,y:24}])
|
||||
|
||||
expect(array.value).toEqual([[1,4], [5,68], [12,24]])
|
||||
})
|
||||
it('parses points with space delimitered x/y coordinates', function() {
|
||||
var array = new SVG.PointArray('221.08 191.79 0.46 191.79 0.46 63.92 63.8 0.46 284.46 0.46 284.46 128.37 221.08 191.79')
|
||||
|
||||
expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79')
|
||||
})
|
||||
it('parses points with comma delimitered x/y coordinates', function() {
|
||||
var array = new SVG.PointArray('221.08,191.79,0.46,191.79,0.46,63.92,63.8,0.46,284.46,0.46,284.46,128.37,221.08,191.79')
|
||||
|
||||
expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79')
|
||||
})
|
||||
it('parses points with comma and space delimitered x/y coordinates', function() {
|
||||
var array = new SVG.PointArray('221.08, 191.79, 0.46, 191.79, 0.46, 63.92, 63.8, 0.46, 284.46, 0.46, 284.46, 128.37, 221.08, 191.79')
|
||||
|
||||
expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79')
|
||||
})
|
||||
it('parses points with space and comma delimitered x/y coordinates', function() {
|
||||
var array = new SVG.PointArray('221.08 ,191.79 ,0.46 ,191.79 ,0.46 ,63.92 ,63.8 ,0.46 ,284.46 ,0.46 ,284.46 ,128.37 ,221.08 ,191.79')
|
||||
|
||||
expect(array + '').toBe('221.08,191.79 0.46,191.79 0.46,63.92 63.8,0.46 284.46,0.46 284.46,128.37 221.08,191.79')
|
||||
})
|
||||
it('parses points with redundant spaces at the end', function() {
|
||||
var array = new SVG.PointArray('2176.6,1708.8 2176.4,1755.8 2245.8,1801.5 2297,1787.8 ')
|
||||
|
||||
expect(array + '').toBe('2176.6,1708.8 2176.4,1755.8 2245.8,1801.5 2297,1787.8')
|
||||
})
|
||||
it('parses points with space delimitered x/y coordinates - even with leading or trailing space', function() {
|
||||
var array = new SVG.PointArray(' 1 2 3 4 ')
|
||||
|
||||
expect(array + '').toBe('1,2 3,4')
|
||||
})
|
||||
it('parses odd number of points with space delimitered x/y coordinates and silently remove the odd point', function() {
|
||||
// this is according to spec: https://svgwg.org/svg2-draft/shapes.html#DataTypePoints
|
||||
|
||||
var array = new SVG.PointArray('1 2 3')
|
||||
|
||||
expect(array + '').toBe('1,2')
|
||||
})
|
||||
it('parses odd number of points in a flat array of x/y coordinates and silently remove the odd point', function() {
|
||||
// this is according to spec: https://svgwg.org/svg2-draft/shapes.html#DataTypePoints
|
||||
|
||||
var array = new SVG.PointArray([1, 2, 3])
|
||||
|
||||
expect(array.value).toEqual([[1,2]])
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('correctly sizes the points over the whole area', function() {
|
||||
var array = new SVG.PointArray([10, 10, 20, 20, 30, 30])
|
||||
expect(array.size(60, 60).valueOf()).toEqual([[10,10], [40, 40], [70, 70]])
|
||||
})
|
||||
|
||||
it('let coordinates untouched when width/height is zero', function() {
|
||||
var array = new SVG.PointArray([10, 10, 10, 20, 10, 30])
|
||||
expect(array.size(60, 60).valueOf()).toEqual([[10,10], [10, 40], [10, 70]])
|
||||
|
||||
array = new SVG.PointArray([10, 10, 20, 10, 30, 10])
|
||||
expect(array.size(60, 60).valueOf()).toEqual([[10,10], [40, 10], [70, 10]])
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
var arr1, arr2
|
||||
|
||||
beforeEach(function() {
|
||||
arr1 = new SVG.PointArray([[1,2],[3,4]])
|
||||
arr2 = new SVG.Array([[2,3],[4,5]])
|
||||
})
|
||||
|
||||
it('returns a new array instance', function() {
|
||||
arr1.morph(arr2)
|
||||
|
||||
start = arr1.at(0)
|
||||
end = arr1.at(1)
|
||||
|
||||
expect(start instanceof SVG.PointArray).toBeTruthy()
|
||||
expect(start).not.toBe(arr1)
|
||||
|
||||
expect(end instanceof SVG.PointArray).toBeTruthy()
|
||||
expect(end).not.toBe(arr2)
|
||||
})
|
||||
it('morphs all values of the array', function() {
|
||||
arr1.morph(arr2)
|
||||
expect(arr1.at(0.5).value).toEqual([[1.5, 2.5], [3.5, 4.5]])
|
||||
})
|
||||
it('returns itself if no destination was specified', function() {
|
||||
expect(arr1.at(0.5)).toBe(arr1)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('PathArray', function () {
|
||||
var p1, p2, p3, p4, p5, p6, p7
|
||||
|
||||
beforeEach(function() {
|
||||
p1 = new SVG.PathArray('m10 10 h 80 v 80 h -80 l 300 400 z')
|
||||
p2 = new SVG.PathArray('m10 80 c 40 10 65 10 95 80 s 150 150 180 80 t 300 300 q 52 10 95 80 z')
|
||||
p3 = new SVG.PathArray('m80 80 A 45 45, 0, 0, 0, 125 125 L 125 80 z')
|
||||
p4 = new SVG.PathArray('M215.458,245.23c0,0,77.403,0,94.274,0S405,216.451,405,138.054S329.581,15,287.9,15c-41.68,0-139.924,0-170.688,0C86.45,15,15,60.65,15,134.084c0,73.434,96.259,112.137,114.122,112.137C146.984,246.221,215.458,245.23,215.458,245.23z')
|
||||
p5 = new SVG.PathArray('M10 10-45-30.5.5 .89L2e-2.5.5.5-.5C.5.5.5.5.5.5L-3-4z')
|
||||
p6 = new SVG.PathArray('m 0,0 0,3189 2209,0 0,-3189 -2209,0 z m 154,154 1901,0 0,2881 -1901,0 0,-2881 z')
|
||||
|
||||
})
|
||||
|
||||
it('converts to absolute values', function() {
|
||||
expect(p1.toString()).toBe('M10 10H90V90H10L310 490Z ')
|
||||
expect(p2.toString()).toBe('M10 80C50 90 75 90 105 160S255 310 285 240T585 540Q637 550 680 620Z ')
|
||||
expect(p3.toString()).toBe('M80 80A45 45 0 0 0 125 125L125 80Z ')
|
||||
expect(p4.toString()).toBe('M215.458 245.23C215.458 245.23 292.861 245.23 309.73199999999997 245.23S405 216.451 405 138.054S329.581 15 287.9 15C246.21999999999997 15 147.97599999999997 15 117.21199999999999 15C86.45 15 15 60.65 15 134.084C15 207.518 111.259 246.221 129.122 246.221C146.984 246.221 215.458 245.23 215.458 245.23Z ')
|
||||
expect(p6.toString()).toBe('M0 0L0 3189L2209 3189L2209 0L0 0ZM154 154L2055 154L2055 3035L154 3035L154 154Z ')
|
||||
})
|
||||
|
||||
it('parses difficult syntax correctly', function() {
|
||||
expect(p5.toString()).toBe('M10 10L-45 -30.5L0.5 0.89L0.02 0.5L0.5 -0.5C0.5 0.5 0.5 0.5 0.5 0.5L-3 -4Z ')
|
||||
})
|
||||
|
||||
it('parses flat arrays correctly', function() {
|
||||
p6 = new SVG.PathArray([ 'M', 0, 0, 'L', 100, 100, 'z' ])
|
||||
expect(p6.toString()).toBe('M0 0L100 100Z ')
|
||||
})
|
||||
|
||||
it('parses nested arrays correctly', function() {
|
||||
p7 = new SVG.PathArray([ ['M', 0, 0], ['L', 100, 100], ['z'] ])
|
||||
expect(p7.toString()).toBe('M0 0L100 100Z ')
|
||||
})
|
||||
|
||||
// this test is designed to cover a certain line but it doesnt work because of #608
|
||||
it('returns the valueOf when PathArray is given', function() {
|
||||
var p = new SVG.PathArray('m10 10 h 80 v 80 h -80 l 300 400 z')
|
||||
|
||||
expect((new SVG.PathArray(p)).value).toEqual(p.value)
|
||||
})
|
||||
|
||||
it('can handle all formats which can be used', function() {
|
||||
// when no command is specified after move, line is used automatically (specs say so)
|
||||
expect(new SVG.PathArray('M10 10 80 80 30 30 Z').toString()).toBe('M10 10L80 80L30 30Z ')
|
||||
|
||||
// parsing can handle 0.5.3.3.2 stuff
|
||||
expect(new SVG.PathArray('M10 10L.5.5.3.3Z').toString()).toBe('M10 10L0.5 0.5L0.3 0.3Z ')
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('moves all points in a straight path', function() {
|
||||
expect(p1.move(100,200).toString()).toBe('M100 200H180V280H100L400 680Z ')
|
||||
})
|
||||
it('moves all points in a curved path', function() {
|
||||
expect(p2.move(100,200).toString()).toBe('M100 200C140 210 165 210 195 280S345 430 375 360T675 660Q727 670 770 740Z ')
|
||||
})
|
||||
it('moves all points in a arc path', function() {
|
||||
expect(p3.move(100,200).toString()).toBe('M100 200A45 45 0 0 0 145 245L145 200Z ')
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('resizes all points in a straight path', function() {
|
||||
expect(p1.size(600,200).toString()).toBe('M10 10H170V43.333333333333336H10L610 210Z ')
|
||||
})
|
||||
it('resizes all points in a curved path', function() {
|
||||
expect(p2.size(600,200).toString()).toBe('M10 80C45.82089552238806 83.70370370370371 68.2089552238806 83.70370370370371 95.07462686567165 109.62962962962963S229.40298507462686 165.1851851851852 256.2686567164179 139.25925925925927T524.9253731343283 250.37037037037038Q571.4925373134329 254.07407407407408 610 280Z ')
|
||||
})
|
||||
it('resizes all points in a arc path', function() {
|
||||
var expected = [
|
||||
['M', 80, 80],
|
||||
['A', 600, 200, 0, 0, 0, 680, 280],
|
||||
['L', 680, 80],
|
||||
['Z']
|
||||
]
|
||||
|
||||
var toBeTested = p3.size(600,200).value
|
||||
for(var i in toBeTested) {
|
||||
expect(toBeTested[i].shift().toUpperCase()).toBe(expected[i].shift().toUpperCase())
|
||||
for(var j in toBeTested[i]) {
|
||||
expect(toBeTested[i][j]).toBeCloseTo(expected[i][j])
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
describe('equalCommands()', function() {
|
||||
it('return true if the passed path array use the same commands', function() {
|
||||
var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
, pathArray2 = new SVG.PathArray('m -680, 527 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
|
||||
expect(pathArray1.equalCommands(pathArray2)).toBe(true)
|
||||
})
|
||||
it('return false if the passed path array does not use the same commands', function() {
|
||||
var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
, pathArray2 = new SVG.PathArray('m - 663, 521 c 147,178 118,-25 245,210 l -565,319 c 0,0 -134,-374 51,-251 185,122 268,-278 268,-278 z')
|
||||
|
||||
expect(pathArray1.equalCommands(pathArray2)).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('should set the attribute destination to the passed path array when it have the same comands as this path array', function() {
|
||||
var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
, pathArray2 = new SVG.PathArray('m -680, 527 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
|
||||
pathArray1.morph(pathArray2)
|
||||
expect(pathArray1.destination).toEqual(pathArray2)
|
||||
})
|
||||
it('should set the attribute destination to null when the passed path array does not have the same comands as this path array', function() {
|
||||
var pathArray1 = new SVG.PathArray('m -1500,-478 a 292,195 0 0 1 262,205 l -565,319 c 0,0 -134,-374 51,-251 185,122 251,-273 251,-273 z')
|
||||
, pathArray2 = new SVG.PathArray('m - 663, 521 c 147,178 118,-25 245,210 l -565,319 c 0,0 -134,-374 51,-251 185,122 268,-278 268,-278 z')
|
||||
|
||||
pathArray1.morph(pathArray2)
|
||||
expect(pathArray1.destination).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('returns a morphed path array at a given position', function() {
|
||||
var pathArray1 = new SVG.PathArray("M 63 25 A 15 15 0 0 1 73 40 A 15 15 0 0 1 61 53 C 49 36 50 59 50 59 L 33 55 Z")
|
||||
, pathArray2 = new SVG.PathArray("M 132 40 A 15 15 0 0 1 141 54 A 15 15 0 0 1 130 67 C 118 51 119 73 119 73 L 103 69 Z")
|
||||
, morphedPathArray = pathArray1.morph(pathArray2).at(0.5)
|
||||
, sourceArray = pathArray1.value, destinationArray = pathArray1.destination.value
|
||||
, morphedArray = morphedPathArray.value
|
||||
, i, il, j, jl
|
||||
|
||||
expect(morphedArray.length).toBe(sourceArray.length)
|
||||
|
||||
// For all the commands
|
||||
for(i = 0, il = sourceArray.length; i < il; i++) {
|
||||
// Expect the current command to be the same
|
||||
expect(morphedArray[i][0]).toBe(sourceArray[i][0])
|
||||
expect(morphedArray[i].length).toBe(sourceArray[i].length)
|
||||
|
||||
// For all the parameters of the current command
|
||||
for(j = 1, jl = sourceArray[i].length; j < jl; j++) {
|
||||
expect(morphedArray[i][j]).toBe((sourceArray[i][j] + destinationArray[i][j]) / 2)
|
||||
}
|
||||
}
|
||||
})
|
||||
it('should interpolate flags and booleans as fractions between zero and one, with any non-zero value considered to be a value of one/true', function() {
|
||||
// Only the Elliptical arc command use flags, it has the following form:
|
||||
// A rx ry x-axis-rotation large-arc-flag sweep-flag x y
|
||||
var pathArray1 = new SVG.PathArray('M 13 13 A 25 37 0 0 1 43 25')
|
||||
, pathArray2 = new SVG.PathArray('M 101 55 A 25 37 0 1 0 130 67')
|
||||
, morphedPathArray
|
||||
|
||||
pathArray1.morph(pathArray2)
|
||||
|
||||
// The morphedPathArray.value contain 2 commands: [['M', ...], ['A', ...]]
|
||||
// Elliptical arc command in a path array followed by corresponding indexes:
|
||||
// ['A', rx, ry, x-axis-rotation, large-arc-flag, sweep-flag, x, y]
|
||||
// 0 1 2 3 4 5 6 7
|
||||
morphedPathArray = pathArray1.at(0)
|
||||
expect(morphedPathArray.value[1][4]).toBe(0)
|
||||
expect(morphedPathArray.value[1][5]).toBe(1)
|
||||
|
||||
morphedPathArray = pathArray1.at(0.5)
|
||||
expect(morphedPathArray.value[1][4]).toBe(1)
|
||||
expect(morphedPathArray.value[1][5]).toBe(1)
|
||||
|
||||
morphedPathArray = pathArray1.at(1)
|
||||
expect(morphedPathArray.value[1][4]).toBe(1)
|
||||
expect(morphedPathArray.value[1][5]).toBe(0)
|
||||
})
|
||||
it('return itself if the destination attribute is null', function(){
|
||||
var pathArray = new SVG.PathArray('M 13 13 A 25 37 0 0 1 43 25')
|
||||
pathArray.destination = null
|
||||
expect(pathArray.at(0.45)).toBe(pathArray)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+41
@@ -0,0 +1,41 @@
|
||||
describe('Bare', function() {
|
||||
|
||||
describe('element()', function() {
|
||||
var element
|
||||
|
||||
beforeEach(function() {
|
||||
element = draw.element('rect')
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Bare', function() {
|
||||
expect(element instanceof SVG.Bare).toBeTruthy()
|
||||
})
|
||||
it('creates element in called parent', function() {
|
||||
expect(element.parent()).toBe(draw)
|
||||
})
|
||||
it('inherits from given parent', function() {
|
||||
expect(draw.element('g', SVG.Container).rect).toBeTruthy()
|
||||
expect(draw.element('g', SVG.Container).group).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('words()', function() {
|
||||
it('inserts plain text in a node', function() {
|
||||
var element = draw.element('title').words('These are some words.').id(null)
|
||||
var result = element.svg()
|
||||
expect(
|
||||
result == '<title>These are some words.</title>'
|
||||
|| result == '<title xmlns="http://www.w3.org/2000/svg">These are some words.</title>'
|
||||
).toBe(true)
|
||||
})
|
||||
it('removes all nodes before adding words', function() {
|
||||
var element = draw.element('title').words('These are some words.').id(null)
|
||||
element.words('These are some words.')
|
||||
var result = element.svg()
|
||||
expect(
|
||||
result == '<title>These are some words.</title>'
|
||||
|| result == '<title xmlns="http://www.w3.org/2000/svg">These are some words.</title>'
|
||||
).toBe(true)
|
||||
})
|
||||
})
|
||||
})
|
||||
+233
@@ -0,0 +1,233 @@
|
||||
describe('Box', function() {
|
||||
it('creates a new instance without passing anything', function() {
|
||||
var box = new SVG.Box
|
||||
|
||||
expect(box instanceof SVG.Box).toBe(true)
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x:0, y:0, cx:0, cy:0, width:0, height:0
|
||||
}))
|
||||
})
|
||||
|
||||
it('creates a new instance with 4 arguments given', function() {
|
||||
var box = new SVG.Box(10, 20, 100, 50)
|
||||
|
||||
expect(box instanceof SVG.Box).toBe(true)
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x:10, y:20, cx:60, cy:45, width:100, height:50
|
||||
}))
|
||||
})
|
||||
|
||||
it('creates a new instance with object given', function() {
|
||||
var box = new SVG.Box({x:10, y:20, width: 100, height:50})
|
||||
|
||||
expect(box instanceof SVG.Box).toBe(true)
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x:10, y:20, cx:60, cy:45, width:100, height:50
|
||||
}))
|
||||
})
|
||||
|
||||
describe('merge()', function() {
|
||||
it('merges various bounding boxes', function() {
|
||||
var box1 = new SVG.Box(50, 50, 100, 100)
|
||||
var box2 = new SVG.Box(300, 400, 100, 100)
|
||||
var box3 = new SVG.Box(500, 100, 100, 100)
|
||||
var merged = box1.merge(box2).merge(box3)
|
||||
|
||||
expect(merged).toEqual(jasmine.objectContaining({
|
||||
x: 50, y: 50, cx: 325, cy: 275, width: 550, height: 450
|
||||
}))
|
||||
})
|
||||
it('returns a new instance', function() {
|
||||
var box1 = new SVG.Box(50, 50, 100, 100)
|
||||
var box2 = new SVG.Box(300, 400, 100, 100)
|
||||
var merged = box1.merge(box2)
|
||||
expect(box1).not.toBe(merged)
|
||||
expect(box2).not.toBe(merged)
|
||||
|
||||
expect(merged instanceof SVG.Box).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('transform()', function() {
|
||||
it('transforms the box with given matrix', function() {
|
||||
var box1 = new SVG.Box(50, 50, 100, 100).transform(new SVG.Matrix(1,0,0,1,20,20))
|
||||
var box2 = new SVG.Box(50, 50, 100, 100).transform(new SVG.Matrix(2,0,0,2,0,0))
|
||||
var box3 = new SVG.Box(-200, -200, 100, 100).transform(new SVG.Matrix(1,0,0,1,-20,-20))
|
||||
|
||||
expect(box1).toEqual(jasmine.objectContaining({
|
||||
x: 70, y: 70, cx: 120, cy: 120, width: 100, height: 100
|
||||
}))
|
||||
|
||||
expect(box2).toEqual(jasmine.objectContaining({
|
||||
x: 100, y: 100, cx: 200, cy: 200, width: 200, height: 200
|
||||
}))
|
||||
|
||||
expect(box3).toEqual(jasmine.objectContaining({
|
||||
x: -220, y: -220, cx: -170, cy: -170, width: 100, height: 100
|
||||
}))
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('BBox', function() {
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('creates a new instance from an element', function() {
|
||||
var rect = draw.rect(100, 100).move(100, 25)
|
||||
var box = new SVG.BBox(rect)
|
||||
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x: 100, y: 25, cx: 150, cy: 75, width: 100, height: 100
|
||||
}))
|
||||
})
|
||||
|
||||
describe('merge()', function() {
|
||||
it('returns an instance of SVG.BBox', function() {
|
||||
var box1 = new SVG.BBox(50, 50, 100, 100)
|
||||
var box2 = new SVG.BBox(300, 400, 100, 100)
|
||||
var merged = box1.merge(box2)
|
||||
|
||||
expect(merged instanceof SVG.BBox).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('TBox', function() {
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('should map to RBox and be removed in 3.x', function() {
|
||||
var rect = draw.rect(100, 100).move(100, 25).stroke({width:0})
|
||||
var tbox = rect.tbox()
|
||||
|
||||
expect(tbox.x).toBe(100)
|
||||
expect(tbox.y).toBeCloseTo(25)
|
||||
|
||||
rect.transform({ scale: 1.5 })
|
||||
tbox = rect.tbox()
|
||||
expect(tbox.x).toBe(75)
|
||||
expect(tbox.y).toBe(0)
|
||||
|
||||
rect.transform({ skewX: 5 })
|
||||
tbox = rect.tbox()
|
||||
expect(tbox.x|0).toBe(68)
|
||||
expect(tbox.y|0).toBe(0)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('RBox', function() {
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('creates a new instance from an element', function() {
|
||||
var rect = draw.rect(100, 100).move(100, 25).stroke({width:0})
|
||||
var box = new SVG.RBox(rect).transform(rect.doc().screenCTM().inverse()).addOffset()
|
||||
expect(window.roundBox(box)).toEqual(jasmine.objectContaining({
|
||||
x: 100, y: 25, cx: 150, cy: 75, width: 100, height: 100
|
||||
}))
|
||||
})
|
||||
|
||||
describe('merge()', function() {
|
||||
it('returns an instance of SVG.RBox', function() {
|
||||
var box1 = new SVG.RBox(50, 50, 100, 100)
|
||||
var box2 = new SVG.RBox(300, 400, 100, 100)
|
||||
var merged = box1.merge(box2)
|
||||
|
||||
expect(merged instanceof SVG.RBox).toBe(true)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('Boxes', function() {
|
||||
var rect, nested, offset
|
||||
|
||||
beforeEach(function() {
|
||||
offset = draw.screenCTM()
|
||||
draw.viewbox(100,100, 200, 200)
|
||||
nested = draw.nested().size(200, 200).move(100,100).viewbox(0, 0, 100, 100)
|
||||
rect = nested.rect(50, 180).stroke({width:0}).move(25, 90).scale(2, 0, 0).transform({x:10, y:10}, true)
|
||||
})
|
||||
afterEach(function() {
|
||||
draw.clear().attr('viewBox', null)
|
||||
})
|
||||
|
||||
describe('bbox()', function() {
|
||||
it('returns an instance of SVG.BBox', function() {
|
||||
expect(rect.bbox() instanceof SVG.BBox).toBeTruthy()
|
||||
})
|
||||
it('matches the size of the target element, ignoring transformations', function() {
|
||||
var box = rect.bbox()
|
||||
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x: 25, y: 90, cx: 50, cy: 180, width: 50, height: 180
|
||||
}))
|
||||
})
|
||||
it('returns a box even if the element is not in the dom', function() {
|
||||
var line = new SVG.Line().plot(0, 0, 50, 50)
|
||||
var box = line.bbox()
|
||||
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x: 0, y: 0, width: 50, height: 50
|
||||
}))
|
||||
|
||||
expect('Should not result into infinite loop').toBe('Should not result into infinite loop')
|
||||
})
|
||||
it('returns a box even if the element is not in the dom and invisible', function() {
|
||||
var line = new SVG.Line().plot(0, 0, 50, 50).hide()
|
||||
var box = line.bbox()
|
||||
|
||||
expect(box).toEqual(jasmine.objectContaining({
|
||||
x: 0, y: 0, width: 50, height: 50
|
||||
}))
|
||||
|
||||
expect('Should not result into infinite loop').toBe('Should not result into infinite loop')
|
||||
})
|
||||
})
|
||||
|
||||
describe('rbox()', function() {
|
||||
it('returns an instance of SVG.RBox', function() {
|
||||
expect(rect.rbox() instanceof SVG.RBox).toBeTruthy()
|
||||
})
|
||||
|
||||
it('returns the elements box in absolute screen coordinates by default', function() {
|
||||
var box = rect.rbox()
|
||||
|
||||
expect(window.roundBox(box)).toEqual(jasmine.objectContaining(window.roundBox({
|
||||
x: 70 + offset.e, y: 200 + offset.f, width: 100, height: 360
|
||||
})))
|
||||
|
||||
})
|
||||
|
||||
it('returns the elements box in coordinates of given element (doc)', function() {
|
||||
var box = rect.rbox(draw)
|
||||
|
||||
expect(window.roundBox(box)).toEqual(jasmine.objectContaining({
|
||||
x: 240, y: 500, width: 200, height: 720
|
||||
}))
|
||||
})
|
||||
|
||||
it('returns the elements box in coordinates of given element (nested)', function() {
|
||||
var box = rect.rbox(nested)
|
||||
|
||||
expect(window.roundBox(box)).toEqual(jasmine.objectContaining({
|
||||
x: 70, y: 200, width: 100, height: 360
|
||||
}))
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+177
@@ -0,0 +1,177 @@
|
||||
describe('Circle', function() {
|
||||
var circle
|
||||
|
||||
beforeEach(function() {
|
||||
circle = draw.circle(240)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(circle.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
circle.x(123)
|
||||
var box = circle.bbox()
|
||||
expect(box.x).toBeCloseTo(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(circle.y()).toBe(0)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
circle.y(345)
|
||||
var box = circle.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(circle.cx()).toBe(120)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
circle.cx(123)
|
||||
var box = circle.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(circle.cy()).toBe(120)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
circle.cy(345)
|
||||
var box = circle.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('radius()', function() {
|
||||
it('sets the r attribute with the first argument', function() {
|
||||
circle.radius(10)
|
||||
expect(circle.node.getAttribute('r')).toBe('10')
|
||||
})
|
||||
})
|
||||
|
||||
describe('rx()', function() {
|
||||
it('sets the r attribute with the first argument', function() {
|
||||
circle.rx(11)
|
||||
expect(circle.node.getAttribute('r')).toBe('11')
|
||||
})
|
||||
it('gets the r attribute without and argument', function() {
|
||||
circle.rx()
|
||||
expect(circle.node.getAttribute('r')).toBe('120')
|
||||
})
|
||||
})
|
||||
|
||||
describe('ry()', function() {
|
||||
it('sets the r attribute with the first argument', function() {
|
||||
circle.ry(12)
|
||||
expect(circle.node.getAttribute('r')).toBe('12')
|
||||
})
|
||||
it('gets the r attribute without and argument', function() {
|
||||
circle.ry()
|
||||
expect(circle.node.getAttribute('r')).toBe('120')
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
circle.move(123, 456)
|
||||
var box = circle.bbox()
|
||||
expect(box.x).toBeCloseTo(123)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
circle.move(50, 60)
|
||||
circle.dx(100)
|
||||
expect(circle.node.getAttribute('cx')).toBe('270')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
circle.move(50, 60)
|
||||
circle.dy(120)
|
||||
expect(circle.node.getAttribute('cy')).toBe('300')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
circle.move(50,60)
|
||||
circle.dmove(80, 25)
|
||||
expect(circle.node.getAttribute('cx')).toBe('250')
|
||||
expect(circle.node.getAttribute('cy')).toBe('205')
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
circle.center(321,567)
|
||||
var box = circle.bbox()
|
||||
expect(box.cx).toBe(321)
|
||||
expect(box.cy).toBe(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width and height of the element', function() {
|
||||
circle.width(82)
|
||||
expect(circle.node.getAttribute('r')).toBe('41')
|
||||
})
|
||||
it('gets the width and height of the element if the argument is null', function() {
|
||||
expect((circle.width() / 2).toString()).toBe(circle.node.getAttribute('r'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height and width of the element', function() {
|
||||
circle.height(1236)
|
||||
expect(circle.node.getAttribute('r')).toBe('618')
|
||||
})
|
||||
it('gets the height and width of the element if the argument is null', function() {
|
||||
expect((circle.height() / 2).toString()).toBe(circle.node.getAttribute('r'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('defines the r of the element', function() {
|
||||
circle.size(987)
|
||||
expect(circle.node.getAttribute('r')).toBe((987 / 2).toString())
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box = circle.scale(2).rbox()
|
||||
|
||||
expect(box.width).toBe(circle.attr('r') * 2 * 2)
|
||||
expect(box.height).toBe(circle.attr('r') * 2 * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box = circle.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box.width).toBe(circle.attr('r') * 2 * 2)
|
||||
expect(box.height).toBe(circle.attr('r') * 2 * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
circle.transform({ x: 12, y: 12 })
|
||||
expect(window.matrixStringToArray(circle.node.getAttribute('transform'))).toEqual([1,0,0,1,12,12])
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
describe('ClipPath', function() {
|
||||
var rect, circle
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
circle = draw.circle(100).move(50, 50)
|
||||
rect.clipWith(circle)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('moves the clipping element to a new clip node', function() {
|
||||
expect(circle.parent() instanceof SVG.ClipPath).toBe(true)
|
||||
})
|
||||
|
||||
it('creates the clip node in the defs node', function() {
|
||||
expect(circle.parent().parent()).toBe(draw.defs())
|
||||
})
|
||||
|
||||
it('sets the "clip-path" attribute on the cliped element with the clip id', function() {
|
||||
expect(rect.attr('clip-path')).toBe('url("#' + circle.parent().attr('id') + '")')
|
||||
})
|
||||
|
||||
it('references the clip element in the masked element', function() {
|
||||
expect(rect.clipper).toBe(circle.parent())
|
||||
})
|
||||
|
||||
it('references the clipped element in the clipPath target list', function() {
|
||||
expect(rect.clipper.targets.indexOf(rect) > -1).toBe(true)
|
||||
})
|
||||
|
||||
it('reuses clip element when clip was given', function() {
|
||||
var clip = rect.clipper
|
||||
expect(draw.rect(100,100).clipWith(clip).clipper).toBe(clip)
|
||||
})
|
||||
|
||||
it('unclips all clipped elements when being removed', function() {
|
||||
rect.clipper.remove()
|
||||
expect(rect.attr('clip-path')).toBe(undefined)
|
||||
})
|
||||
|
||||
describe('unclip()', function() {
|
||||
|
||||
it('clears the "clip-path" attribute on the clipped element', function() {
|
||||
rect.unclip()
|
||||
expect(rect.attr('clip-path')).toBe(undefined)
|
||||
})
|
||||
|
||||
it('removes the reference to the clipping element', function() {
|
||||
rect.unclip()
|
||||
expect(rect.clipper).toBe(undefined)
|
||||
})
|
||||
|
||||
it('returns the clipPath element', function() {
|
||||
expect(rect.unclip()).toBe(rect)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+86
@@ -0,0 +1,86 @@
|
||||
describe('Color', function() {
|
||||
var color
|
||||
|
||||
beforeEach(function() {
|
||||
color = new SVG.Color({ r: 0, g: 102, b: 255 })
|
||||
})
|
||||
|
||||
it('correclty parses a rgb string', function() {
|
||||
color = new SVG.Color('rgb(255,0,128)')
|
||||
expect(color.r).toBe(255)
|
||||
expect(color.g).toBe(0)
|
||||
expect(color.b).toBe(128)
|
||||
})
|
||||
|
||||
it('correclty parses a 3 digit hex string', function() {
|
||||
color = new SVG.Color('#f06')
|
||||
expect(color.r).toBe(255)
|
||||
expect(color.g).toBe(0)
|
||||
expect(color.b).toBe(102)
|
||||
})
|
||||
|
||||
it('correclty parses a 6 digit hex string', function() {
|
||||
color = new SVG.Color('#0066ff')
|
||||
expect(color.r).toBe(0)
|
||||
expect(color.g).toBe(102)
|
||||
expect(color.b).toBe(255)
|
||||
})
|
||||
|
||||
describe('toHex()', function() {
|
||||
it('returns a hex color', function() {
|
||||
expect(color.toHex()).toBe('#0066ff')
|
||||
})
|
||||
})
|
||||
|
||||
describe('toRgb()', function() {
|
||||
it('returns a rgb string color', function() {
|
||||
expect(color.toRgb()).toBe('rgb(0,102,255)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('brightness()', function() {
|
||||
it('returns the percieved brightness value of a color', function() {
|
||||
expect(color.brightness()).toBe(0.346)
|
||||
})
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('prepares the color for morphing', function() {
|
||||
var destination = new SVG.Color
|
||||
color.morph(destination)
|
||||
expect(color.destination).toEqual(destination)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('morphes color to a given position', function() {
|
||||
var destination = new SVG.Color
|
||||
var morphed = color.morph(destination).at(0.5)
|
||||
expect(morphed.r).toBe(0)
|
||||
expect(morphed.g).toBe(51)
|
||||
expect(morphed.b).toBe(127)
|
||||
})
|
||||
|
||||
it('morphes color to 1 with higher values', function() {
|
||||
var destination = new SVG.Color('#fff')
|
||||
var morphed = color.morph(destination).at(2)
|
||||
expect(morphed.r).toBe(255)
|
||||
expect(morphed.g).toBe(255)
|
||||
expect(morphed.b).toBe(255)
|
||||
})
|
||||
|
||||
it('morphes color to 0 with lower values', function() {
|
||||
var destination = new SVG.Color('#fff')
|
||||
var morphed = color.morph(destination).at(-3)
|
||||
expect(morphed.r).toBe(0)
|
||||
expect(morphed.g).toBe(102)
|
||||
expect(morphed.b).toBe(255)
|
||||
})
|
||||
|
||||
it('returns itself when no destination specified', function() {
|
||||
expect(color.at(0.5)).toBe(color)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
+362
@@ -0,0 +1,362 @@
|
||||
describe('Container', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('rect()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.rect(100,100)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a rect', function() {
|
||||
expect(draw.rect(100,100).type).toBe('rect')
|
||||
})
|
||||
it('should create an instance of SVG.Rect', function() {
|
||||
expect(draw.rect(100,100) instanceof SVG.Rect).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.rect(100,100) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.rect(100,100) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('ellipse()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.ellipse(100,100)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create an ellipse', function() {
|
||||
expect(draw.ellipse(100,100).type).toBe('ellipse')
|
||||
})
|
||||
it('should create an instance of SVG.Ellipse', function() {
|
||||
expect(draw.ellipse(100,100) instanceof SVG.Ellipse).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.ellipse(100,100) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.ellipse(100,100) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('circle()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.circle(100)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create an circle', function() {
|
||||
expect(draw.circle(100).type).toBe('circle')
|
||||
})
|
||||
it('should create an instance of SVG.Circle', function() {
|
||||
expect(draw.circle(100) instanceof SVG.Circle).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.circle(100) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.circle(100) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('line()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.line(0,100,100,0)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a line', function() {
|
||||
expect(draw.line(0,100,100,0).type).toBe('line')
|
||||
})
|
||||
it('should create an instance of SVG.Line', function() {
|
||||
expect(draw.line(0,100,100,0) instanceof SVG.Line).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.line(0,100,100,0) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.line(0,100,100,0) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('polyline()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.polyline('0,0 100,0 100,100 0,100')
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a polyline', function() {
|
||||
expect(draw.polyline('0,0 100,0 100,100 0,100').type).toBe('polyline')
|
||||
})
|
||||
it('should be an instance of SVG.Polyline', function() {
|
||||
expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Polyline).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.polyline('0,0 100,0 100,100 0,100') instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('polygon()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.polygon('0,0 100,0 100,100 0,100')
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a polygon', function() {
|
||||
expect(draw.polygon('0,0 100,0 100,100 0,100').type).toBe('polygon')
|
||||
})
|
||||
it('should be an instance of SVG.Polygon', function() {
|
||||
expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Polygon).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.polygon('0,0 100,0 100,100 0,100') instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('path()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.path(svgPath)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a path', function() {
|
||||
expect(draw.path(svgPath).type).toBe('path')
|
||||
})
|
||||
it('should be an instance of SVG.Path', function() {
|
||||
expect(draw.path(svgPath) instanceof SVG.Path).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.path(svgPath) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.path(svgPath) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('image()', function() {
|
||||
it('should increase children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.image(imageUrl, 100, 100)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('should create a rect', function() {
|
||||
expect(draw.image(imageUrl, 100, 100).type).toBe('image')
|
||||
})
|
||||
it('should create an instance of SVG.Rect', function() {
|
||||
expect(draw.image(imageUrl, 100, 100) instanceof SVG.Image).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Shape', function() {
|
||||
expect(draw.image(imageUrl, 100, 100) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('should be an instance of SVG.Element', function() {
|
||||
expect(draw.image(imageUrl, 100, 100) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('text()', function() {
|
||||
it('increases children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.text(loremIpsum)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('creates a text element', function() {
|
||||
expect(draw.text(loremIpsum).type).toBe('text')
|
||||
})
|
||||
it('creates an instance of SVG.Rect', function() {
|
||||
expect(draw.text(loremIpsum) instanceof SVG.Text).toBe(true)
|
||||
})
|
||||
it('is an instance of SVG.Shape', function() {
|
||||
expect(draw.text(loremIpsum) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('is an instance of SVG.Element', function() {
|
||||
expect(draw.text(loremIpsum) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('plain()', function() {
|
||||
it('increases children by 1', function() {
|
||||
var initial = draw.children().length
|
||||
draw.plain(loremIpsum)
|
||||
expect(draw.children().length).toBe(initial + 1)
|
||||
})
|
||||
it('creates a plain element', function() {
|
||||
expect(draw.plain(loremIpsum).type).toBe('text')
|
||||
})
|
||||
it('creates an instance of SVG.Rect', function() {
|
||||
expect(draw.plain(loremIpsum) instanceof SVG.Text).toBe(true)
|
||||
})
|
||||
it('is an instance of SVG.Shape', function() {
|
||||
expect(draw.plain(loremIpsum) instanceof SVG.Shape).toBe(true)
|
||||
})
|
||||
it('is an instance of SVG.Element', function() {
|
||||
expect(draw.plain(loremIpsum) instanceof SVG.Element).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('removes all children except the parser if present', function() {
|
||||
draw.rect(100,100)
|
||||
draw.clear()
|
||||
expect(draw.children().length).toBe(parserInDoc)
|
||||
})
|
||||
it('creates a new defs node', function() {
|
||||
var oldDefs = draw.defs()
|
||||
draw.rect(100,100).maskWith(draw.circle(100, 100))
|
||||
draw.clear()
|
||||
expect(draw.defs()).not.toBe(oldDefs)
|
||||
})
|
||||
it('clears all children in the defs node', function() {
|
||||
draw.rect(100,100).maskWith(draw.circle(100, 100))
|
||||
draw.clear()
|
||||
expect(draw.defs().children().length).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('each()', function() {
|
||||
it('should iterate over all children', function() {
|
||||
var children = []
|
||||
|
||||
draw.rect(100,100)
|
||||
draw.ellipse(100, 100)
|
||||
draw.polygon()
|
||||
|
||||
draw.each(function() {
|
||||
children.push(this.type)
|
||||
})
|
||||
expect(children).toEqual((parserInDoc ? [parser[0].type] : []).concat(['rect', 'ellipse', 'polygon']))
|
||||
})
|
||||
it('should only include the its own children', function() {
|
||||
var children = []
|
||||
, group = draw.group()
|
||||
|
||||
draw.rect(100,200)
|
||||
draw.circle(300)
|
||||
|
||||
group.rect(100,100)
|
||||
group.ellipse(100, 100)
|
||||
group.polygon()
|
||||
|
||||
group.each(function() {
|
||||
children.push(this)
|
||||
})
|
||||
|
||||
expect(children).toEqual(group.children())
|
||||
})
|
||||
it('should traverse recursively when set to deep', function() {
|
||||
var children = []
|
||||
, group = draw.group()
|
||||
|
||||
draw.rect(100,200)
|
||||
draw.circle(300)
|
||||
|
||||
group.rect(100,100)
|
||||
group.ellipse(100, 100)
|
||||
group.polygon()
|
||||
|
||||
draw.each(function() {
|
||||
children.push(this)
|
||||
}, true)
|
||||
|
||||
expect(children.length).toEqual(draw.children().length + group.children().length + (parserInDoc ? parser[0].children().length : 0))
|
||||
})
|
||||
})
|
||||
|
||||
describe('get()', function() {
|
||||
it('gets an element at a given index', function() {
|
||||
draw.clear()
|
||||
var rect = draw.rect(100,100)
|
||||
var circle = draw.circle(100)
|
||||
var line = draw.line(0,0,100,100)
|
||||
expect(draw.get(0+parserInDoc)).toBe(rect)
|
||||
expect(draw.get(1+parserInDoc)).toBe(circle)
|
||||
expect(draw.get(2+parserInDoc)).toBe(line)
|
||||
expect(draw.get(3+parserInDoc)).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('first()', function() {
|
||||
it('gets the first child', function() {
|
||||
draw.clear()
|
||||
var rect = draw.rect(100,100)
|
||||
var circle = draw.circle(100)
|
||||
var line = draw.line(0,0,100,100)
|
||||
expect(draw.first()).toBe(parserInDoc ? parser[0] : rect)
|
||||
})
|
||||
})
|
||||
|
||||
describe('last()', function() {
|
||||
it('gets the last child', function() {
|
||||
draw.clear()
|
||||
var rect = draw.rect(100,100)
|
||||
var circle = draw.circle(100)
|
||||
var line = draw.line(0,0,100,100)
|
||||
expect(draw.last()).toBe(line)
|
||||
})
|
||||
})
|
||||
|
||||
describe('has()', function() {
|
||||
it('determines if a given element is a child of the parent', function() {
|
||||
var rect = draw.rect(100,100)
|
||||
var circle = draw.circle(100)
|
||||
var group = draw.group()
|
||||
var line = group.line(0,0,100,100)
|
||||
expect(draw.has(rect)).toBe(true)
|
||||
expect(draw.has(circle)).toBe(true)
|
||||
expect(draw.has(group)).toBe(true)
|
||||
expect(draw.has(line)).toBe(false)
|
||||
expect(group.has(line)).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('index()', function() {
|
||||
it('determines the index of given element', function() {
|
||||
var rect = draw.rect(100,100)
|
||||
var circle = draw.circle(100)
|
||||
var group = draw.group()
|
||||
var line = group.line(0,0,100,100)
|
||||
expect(draw.index(rect)).toBe(0+parserInDoc)
|
||||
expect(draw.index(circle)).toBe(1+parserInDoc)
|
||||
expect(draw.index(group)).toBe(2+parserInDoc)
|
||||
expect(draw.index(line)).toBe(-1)
|
||||
expect(group.index(line)).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('parent()', function() {
|
||||
it('returns the parent element instance', function() {
|
||||
var rect = draw.rect(100,100)
|
||||
expect(rect.parent()).toBe(rect.node.parentNode.instance)
|
||||
})
|
||||
})
|
||||
|
||||
describe('defs()', function() {
|
||||
it('returns the defs from the svg', function() {
|
||||
var g = draw.group()
|
||||
expect(g.defs()).toBe(draw.doc().defs())
|
||||
expect(g.defs() instanceof SVG.Defs).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
describe('Defs', function() {
|
||||
var defs
|
||||
|
||||
beforeEach(function() {
|
||||
defs = draw.defs()
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Defs', function() {
|
||||
expect(defs instanceof SVG.Defs).toBeTruthy()
|
||||
})
|
||||
|
||||
})
|
||||
+74
@@ -0,0 +1,74 @@
|
||||
describe('Doc', function() {
|
||||
|
||||
describe('create()', function(){
|
||||
it('doenst alter size when adopting width SVG()', function() {
|
||||
var svg = SVG('inlineSVG')
|
||||
expect(svg.width()).toBe(0)
|
||||
expect(svg.height()).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
it('is an instance of SVG.Container', function() {
|
||||
expect(draw instanceof SVG.Container).toBe(true)
|
||||
})
|
||||
|
||||
it('is an instance of SVG.Doc', function() {
|
||||
expect(draw instanceof SVG.Doc).toBe(true)
|
||||
})
|
||||
|
||||
it('returns itself as Doc', function() {
|
||||
expect(draw.doc()).toBe(draw)
|
||||
})
|
||||
|
||||
it('has a defs element', function() {
|
||||
expect(draw.defs() instanceof SVG.Defs).toBe(true)
|
||||
})
|
||||
|
||||
describe('defs()', function() {
|
||||
it('returns defs element', function(){
|
||||
expect(draw.defs()).toBe(draw._defs)
|
||||
})
|
||||
it('references parent node', function(){
|
||||
expect(draw.defs().parent()).toBe(draw)
|
||||
})
|
||||
})
|
||||
|
||||
describe('remove()', function() {
|
||||
it('removes the doc from the dom only if doc is not root element', function() {
|
||||
var cnt = window.document.querySelectorAll('svg').length
|
||||
draw.remove()
|
||||
if(parserInDoc){
|
||||
expect(window.document.querySelectorAll('svg').length).toBe(cnt)
|
||||
}else{
|
||||
expect(window.document.querySelectorAll('svg').length).toBe(cnt-1)
|
||||
}
|
||||
|
||||
draw = SVG(drawing).size(100,100);
|
||||
expect(window.document.querySelectorAll('svg').length).toBe(cnt)
|
||||
})
|
||||
})
|
||||
|
||||
describe('clone()', function () {
|
||||
it('clones the doc and inserts the clone after the doc', function () {
|
||||
var clone = draw.clone()
|
||||
|
||||
expect(draw.node.nextSibling).toBe(clone.node)
|
||||
clone.remove()
|
||||
})
|
||||
it('clones the doc and inserts the clone in the provided parent', function () {
|
||||
var el = document.createElement('div')
|
||||
var clone = draw.clone(el)
|
||||
|
||||
expect(clone.node.parentNode).toBe(el)
|
||||
})
|
||||
})
|
||||
|
||||
describe('parent()', function () {
|
||||
it('returns null if nodeName is document-fragment', function() {
|
||||
var fragment = document.createDocumentFragment();
|
||||
var svgFrag = new SVG(fragment);
|
||||
expect(svgFrag.parent()).toBe(null);
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
describe('SVG.easing', function() {
|
||||
var easedValues = {
|
||||
'-':0.5,
|
||||
'<>':0.5,
|
||||
'>':0.7071,
|
||||
'<':0.2929,
|
||||
}
|
||||
|
||||
;['-', '<>', '<', '>'].forEach(function(el) {
|
||||
describe(el, function() {
|
||||
it('is 0 at 0', function() {
|
||||
expect(SVG.easing[el](0)).toBe(0)
|
||||
})
|
||||
it('is 1 at 1', function() {
|
||||
expect(Math.round(SVG.easing[el](1)*1000)/1000).toBe(1) // we need to round cause for some reason at some point 1==0.999999999
|
||||
})
|
||||
it('is eased at 0.5', function() {
|
||||
expect(SVG.easing[el](0.5)).toBeCloseTo(easedValues[el])
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
+1001
File diff suppressed because it is too large
Load Diff
+187
@@ -0,0 +1,187 @@
|
||||
describe('Ellipse', function() {
|
||||
var ellipse
|
||||
|
||||
beforeEach(function() {
|
||||
ellipse = draw.ellipse(240,90)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(ellipse.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
ellipse.x(123)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.x).toBeCloseTo(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(ellipse.y()).toBe(0)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
ellipse.y(345)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(ellipse.cx()).toBe(120)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
ellipse.cx(123)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(ellipse.cy()).toBe(45)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
ellipse.cy(345)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('radius()', function() {
|
||||
it('sets the rx and ry', function() {
|
||||
ellipse.radius(10, 20)
|
||||
expect(ellipse.node.getAttribute('rx')).toBe('10')
|
||||
expect(ellipse.node.getAttribute('ry')).toBe('20')
|
||||
})
|
||||
it('sets the rx and ry if only rx given', function() {
|
||||
ellipse.radius(30)
|
||||
expect(ellipse.node.getAttribute('rx')).toBe('30')
|
||||
expect(ellipse.node.getAttribute('ry')).toBe('30')
|
||||
})
|
||||
it('sets the rx and ry value correctly when given 0', function() {
|
||||
ellipse.radius(11, 0)
|
||||
expect(ellipse.node.getAttribute('rx')).toBe('11')
|
||||
expect(ellipse.node.getAttribute('ry')).toBe('0')
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
ellipse.move(123, 456)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.x).toBeCloseTo(123)
|
||||
expect(box.y).toBeCloseTo(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
ellipse.move(50, 60)
|
||||
ellipse.dx(100)
|
||||
expect(ellipse.node.getAttribute('cx')).toBe('270')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
ellipse.move(50, 60)
|
||||
ellipse.dy(120)
|
||||
expect(ellipse.node.getAttribute('cy')).toBe('225')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
ellipse.move(50,60)
|
||||
ellipse.dmove(80, 25)
|
||||
expect(ellipse.node.getAttribute('cx')).toBe('250')
|
||||
expect(ellipse.node.getAttribute('cy')).toBe('130')
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
ellipse.center(321,567)
|
||||
var box = ellipse.bbox()
|
||||
expect(box.cx).toBe(321)
|
||||
expect(box.cy).toBe(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width of the element', function() {
|
||||
ellipse.width(82)
|
||||
expect(ellipse.node.getAttribute('rx')).toBe('41')
|
||||
})
|
||||
it('gets the width of the element if the argument is null', function() {
|
||||
expect((ellipse.width() / 2).toString()).toBe(ellipse.node.getAttribute('rx'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height of the element', function() {
|
||||
ellipse.height(1236)
|
||||
expect(ellipse.node.getAttribute('ry')).toBe('618')
|
||||
})
|
||||
it('gets the height of the element if the argument is null', function() {
|
||||
expect((ellipse.height() / 2).toString()).toBe(ellipse.node.getAttribute('ry'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('defines the rx and ry of the element', function() {
|
||||
ellipse.size(987,654)
|
||||
expect(ellipse.node.getAttribute('rx')).toBe((987 / 2).toString())
|
||||
expect(ellipse.node.getAttribute('ry')).toBe((654 / 2).toString())
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = ellipse.bbox()
|
||||
ellipse.size(500)
|
||||
expect(ellipse.width()).toBe(500)
|
||||
expect(ellipse.width() / ellipse.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = ellipse.bbox()
|
||||
ellipse.size(null, 525)
|
||||
expect(ellipse.height()).toBe(525)
|
||||
expect(ellipse.width() / ellipse.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box = ellipse.scale(2).rbox()
|
||||
|
||||
expect(box.width).toBe(ellipse.attr('rx') * 2 * 2)
|
||||
expect(box.height).toBe(ellipse.attr('ry') * 2 * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box = ellipse.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box.width).toBe(ellipse.attr('rx') * 2 * 2)
|
||||
expect(box.height).toBe(ellipse.attr('ry') * 2 * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
ellipse.transform({ x: 12, y: 12 })
|
||||
expect(ellipse.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+262
@@ -0,0 +1,262 @@
|
||||
describe('Event', function() {
|
||||
var rect, context
|
||||
, toast = null
|
||||
, fruitsInDetail = null,
|
||||
action = function(e) {
|
||||
toast = 'ready'
|
||||
context = this
|
||||
fruitsInDetail = e.detail || null
|
||||
}
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100, 100)
|
||||
spyOn(SVG,'on').and.callThrough()
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
toast = context = null
|
||||
})
|
||||
|
||||
if (!this.isTouchDevice) {
|
||||
[ 'click'
|
||||
, 'dblclick'
|
||||
, 'mousedown'
|
||||
, 'mouseup'
|
||||
, 'mouseover'
|
||||
, 'mouseout'
|
||||
, 'mousemove'
|
||||
, 'mouseenter'
|
||||
, 'mouseleave'
|
||||
].forEach(function(event) {
|
||||
describe(event+'()', function() {
|
||||
it('calls `on()` with '+event+' as event', function() {
|
||||
rect[event](action)
|
||||
expect(SVG.on).toHaveBeenCalledWith(rect, event, action)
|
||||
})
|
||||
})
|
||||
})
|
||||
} else {
|
||||
[ 'touchstart'
|
||||
, 'touchmove'
|
||||
, 'touchleave'
|
||||
, 'touchend'
|
||||
, 'touchcancel'
|
||||
].forEach(function(event) {
|
||||
describe(event+'()', function() {
|
||||
it('calls `on()` with '+event+' as event', function() {
|
||||
rect[event](action)
|
||||
expect(SVG.on).toHaveBeenCalledWith(rect, event, action)
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
describe('on()', function() {
|
||||
|
||||
it('attaches an event to the element', function() {
|
||||
rect.on('event', action).fire('event')
|
||||
expect(toast).toBe('ready')
|
||||
})
|
||||
it('attaches an event to a non svg element', function() {
|
||||
var el = document.createElement('div')
|
||||
SVG.on(el, 'event', action)
|
||||
el.dispatchEvent(new window.CustomEvent('event'))
|
||||
expect(toast).toBe('ready')
|
||||
SVG.off(el, 'event', action)
|
||||
})
|
||||
it('attaches multiple handlers on different element', function() {
|
||||
var rect2 = draw.rect(100, 100)
|
||||
var rect3 = draw.rect(100, 100)
|
||||
|
||||
rect.on('event', action)
|
||||
rect2.on('event', action)
|
||||
rect3.on('event', function(){ butter = 'melting' })
|
||||
rect3.on('event', action)
|
||||
|
||||
expect(Object.keys(rect._events['event']['*']).length).toBe(1) // 1 listener on rect
|
||||
expect(Object.keys(rect2._events['event']['*']).length).toBe(1) // 1 listener on rect2
|
||||
expect(Object.keys(rect3._events['event']['*']).length).toBe(2) // 2 listener on rect3
|
||||
})
|
||||
it('attaches a handler to a namespaced event', function(){
|
||||
var rect2 = draw.rect(100, 100)
|
||||
var rect3 = draw.rect(100, 100)
|
||||
|
||||
rect.on('event.namespace1', action)
|
||||
rect2.on('event.namespace2', action)
|
||||
rect3.on('event.namespace3', function(){ butter = 'melting' })
|
||||
rect3.on('event', action)
|
||||
|
||||
expect(rect._events['event']['*']).toBeUndefined() // no global listener on rect
|
||||
expect(Object.keys(rect._events['event']['namespace1']).length).toBe( 1) // 1 namespaced listener on rect
|
||||
expect(Object.keys(rect2._events['event']['namespace2']).length).toBe(1) // 1 namespaced listener on rect2
|
||||
expect(Object.keys(rect3._events['event']['*']).length).toBe(1) // 1 gobal listener on rect3
|
||||
expect(Object.keys(rect3._events['event']['namespace3']).length).toBe(1) // 1 namespaced listener on rect3
|
||||
})
|
||||
it('applies the element as context', function() {
|
||||
rect.on('event', action).fire('event')
|
||||
expect(context).toBe(rect)
|
||||
})
|
||||
it('applies given object as context', function() {
|
||||
rect.on('event', action, this).fire('event')
|
||||
expect(context).toBe(this)
|
||||
})
|
||||
it('stores the listener for future reference', function() {
|
||||
rect.on('event', action)
|
||||
expect(rect._events['event']['*'][action._svgjsListenerId]).not.toBeUndefined()
|
||||
})
|
||||
it('returns the called element', function() {
|
||||
expect(rect.on('event', action)).toBe(rect)
|
||||
})
|
||||
})
|
||||
|
||||
describe('off()', function() {
|
||||
var butter = null
|
||||
|
||||
beforeEach(function() {
|
||||
butter = null
|
||||
})
|
||||
|
||||
it('detaches a specific event listener, all other still working', function() {
|
||||
rect2 = draw.rect(100,100)
|
||||
rect3 = draw.rect(100,100)
|
||||
|
||||
rect.on('event', action)
|
||||
rect2.on('event', action)
|
||||
rect3.on('event', function(){ butter = 'melting' })
|
||||
|
||||
rect.off('event', action)
|
||||
|
||||
expect(Object.keys(rect._events['event']['*']).length).toBe(0)
|
||||
|
||||
rect.fire('event')
|
||||
expect(toast).toBeNull()
|
||||
|
||||
rect2.fire('event')
|
||||
expect(toast).toBe('ready')
|
||||
|
||||
rect3.fire('event')
|
||||
expect(butter).toBe('melting')
|
||||
|
||||
expect(rect._events['event']['*'][action]).toBeUndefined()
|
||||
})
|
||||
it('detaches a specific namespaced event listener, all other still working', function() {
|
||||
rect2 = draw.rect(100,100)
|
||||
rect3 = draw.rect(100,100)
|
||||
|
||||
rect.on('event.namespace', action)
|
||||
rect2.on('event.namespace', action)
|
||||
rect3.on('event.namespace', function(){ butter = 'melting' })
|
||||
|
||||
rect.off('event.namespace', action)
|
||||
|
||||
expect(Object.keys(rect._events['event']['namespace']).length).toBe(0)
|
||||
expect(Object.keys(rect2._events['event']['namespace']).length).toBe(1)
|
||||
|
||||
rect.fire('event')
|
||||
expect(toast).toBeNull()
|
||||
|
||||
rect2.fire('event')
|
||||
expect(toast).toBe('ready')
|
||||
|
||||
rect3.fire('event')
|
||||
expect(butter).toBe('melting')
|
||||
|
||||
expect(rect._events['event']['namespace'][action]).toBeUndefined()
|
||||
})
|
||||
it('detaches all listeners for a specific namespace', function() {
|
||||
rect.on('event', action)
|
||||
rect.on('event.namespace', function() { butter = 'melting'; })
|
||||
rect.off('.namespace')
|
||||
|
||||
rect.fire('event')
|
||||
expect(toast).toBe('ready')
|
||||
expect(butter).toBeNull()
|
||||
})
|
||||
it('detaches all listeners for an event without a listener given', function() {
|
||||
rect.on('event', action)
|
||||
rect.on('event.namespace', function() { butter = 'melting'; })
|
||||
rect.off('event')
|
||||
|
||||
rect.fire('event')
|
||||
expect(toast).toBeNull()
|
||||
expect(butter).toBeNull()
|
||||
expect(rect._events['event']).toBeUndefined()
|
||||
})
|
||||
it('detaches all listeners without an argument', function() {
|
||||
rect.on('event', action)
|
||||
rect.on('click', function() { butter = 'melting' })
|
||||
rect.off()
|
||||
rect.fire('event')
|
||||
rect.fire('click')
|
||||
expect(toast).toBeNull()
|
||||
expect(butter).toBeNull()
|
||||
expect(Object.keys(rect._events).length).toBe(0)
|
||||
})
|
||||
it('returns the called element', function() {
|
||||
expect(rect.off('event', action)).toBe(rect)
|
||||
})
|
||||
it('does not throw when event is removed which was already removed with a global off', function() {
|
||||
var undefined
|
||||
|
||||
rect.on('event', action)
|
||||
rect.off()
|
||||
try{
|
||||
rect.off('event')
|
||||
}catch(e){
|
||||
expect('Should not error out').toBe(true)
|
||||
}
|
||||
|
||||
expect(Object.keys(rect._events).length).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('fire()', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
rect.on('event', action)
|
||||
})
|
||||
|
||||
it('fires an event for the element', function() {
|
||||
expect(toast).toBeNull()
|
||||
rect.fire('event')
|
||||
expect(toast).toBe('ready')
|
||||
expect(fruitsInDetail).toBe(null)
|
||||
})
|
||||
it('returns the called element', function() {
|
||||
expect(rect.fire('event')).toBe(rect)
|
||||
})
|
||||
it('fires event with additional data', function() {
|
||||
expect(fruitsInDetail).toBeNull()
|
||||
rect.fire('event', {apple:1})
|
||||
expect(fruitsInDetail).not.toBe(null)
|
||||
expect(fruitsInDetail.apple).toBe(1)
|
||||
})
|
||||
it('fires my own event', function() {
|
||||
toast = null
|
||||
rect.fire(new window.CustomEvent('event'))
|
||||
expect(toast).toBe('ready')
|
||||
})
|
||||
it('makes the event cancelable', function() {
|
||||
rect.on('event', function(e) {
|
||||
e.preventDefault()
|
||||
})
|
||||
rect.fire('event')
|
||||
expect(rect._event.defaultPrevented).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('event()', function() {
|
||||
it('returns null when no event was fired', function() {
|
||||
expect(rect.event()).toBe(null)
|
||||
})
|
||||
it('returns the last fired event', function() {
|
||||
var event = new window.CustomEvent('foo')
|
||||
rect.fire(event)
|
||||
expect(rect.event()).toBe(event)
|
||||
|
||||
event = new window.CustomEvent('bar')
|
||||
rect.fire(event)
|
||||
expect(rect.event()).toBe(event)
|
||||
})
|
||||
})
|
||||
})
|
||||
+2952
File diff suppressed because it is too large
Load Diff
+151
@@ -0,0 +1,151 @@
|
||||
describe('Gradient', function() {
|
||||
var rect, gradient
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
stop.at({ offset: 0, color: '#333', opacity: 1 })
|
||||
stop.at({ offset: 1, color: '#fff', opacity: 1 })
|
||||
})
|
||||
radial = draw.gradient('radial', function(stop) {
|
||||
stop.at({ offset: 0, color: '#333', opacity: 1 })
|
||||
stop.at({ offset: 1, color: '#fff', opacity: 1 })
|
||||
})
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
gradient.remove()
|
||||
})
|
||||
|
||||
it('is an instance of SVG.Gradient', function() {
|
||||
expect(gradient instanceof SVG.Gradient).toBe(true)
|
||||
})
|
||||
|
||||
it('allows creation of a new gradient without block', function() {
|
||||
gradient = draw.gradient('linear')
|
||||
expect(gradient.children().length).toBe(0)
|
||||
})
|
||||
|
||||
describe('fill()', function() {
|
||||
it('returns the id of the gradient wrapped in url()', function() {
|
||||
expect(gradient.fill()).toBe('url(#' + gradient.attr('id') + ')')
|
||||
})
|
||||
})
|
||||
|
||||
describe('from()', function() {
|
||||
it('sets fx and fy attribute for radial gradients', function() {
|
||||
radial.from(7, 10)
|
||||
expect(radial.attr('fx')).toBe(7)
|
||||
expect(radial.attr('fy')).toBe(10)
|
||||
})
|
||||
it('sets x1 and y1 attribute for linear gradients', function() {
|
||||
gradient.from(7, 10)
|
||||
expect(gradient.attr('x1')).toBe(7)
|
||||
expect(gradient.attr('y1')).toBe(10)
|
||||
})
|
||||
})
|
||||
|
||||
describe('to()', function() {
|
||||
it('sets cx and cy attribute for radial gradients', function() {
|
||||
radial.to(75, 105)
|
||||
expect(radial.attr('cx')).toBe(75)
|
||||
expect(radial.attr('cy')).toBe(105)
|
||||
})
|
||||
it('sets x2 and y2 attribute for linear gradients', function() {
|
||||
gradient.to(75, 105)
|
||||
expect(gradient.attr('x2')).toBe(75)
|
||||
expect(gradient.attr('y2')).toBe(105)
|
||||
})
|
||||
})
|
||||
|
||||
describe('attr()', function() {
|
||||
it('will catch transform attribues and convert them to gradientTransform', function() {
|
||||
expect(gradient.translate(100,100).attr('gradientTransform')).toBe('matrix(1,0,0,1,100,100)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('toString()', function() {
|
||||
it('returns the id of the gradient wrapped in url()', function() {
|
||||
expect(gradient + '').toBe('url(#' + gradient.attr('id') + ')')
|
||||
})
|
||||
it('is called when instance is passed as an attribute value', function() {
|
||||
rect.attr('fill', gradient)
|
||||
expect(rect.attr('fill')).toBe('url(#' + gradient.attr('id') + ')')
|
||||
})
|
||||
})
|
||||
|
||||
describe('input values', function() {
|
||||
var s1, s2
|
||||
|
||||
it('accepts floats', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at({ offset: 0.12, color: '#333', opacity: 1 })
|
||||
s2 = stop.at({ offset: 0.93, color: '#fff', opacity: 1 })
|
||||
})
|
||||
expect(s1.attr('offset')).toBe(0.12)
|
||||
expect(s2.attr('offset')).toBe(0.93)
|
||||
})
|
||||
it('accepts string floats', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at({ offset: '0.13', color: '#333', opacity: 1 })
|
||||
s2 = stop.at({ offset: '0.92', color: '#fff', opacity: 1 })
|
||||
})
|
||||
expect(s1.attr('offset')).toBe(0.13)
|
||||
expect(s2.attr('offset')).toBe(0.92)
|
||||
})
|
||||
it('accept percentages', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at({ offset: '14%', color: '#333', opacity: 1 })
|
||||
s2 = stop.at({ offset: '91%', color: '#fff', opacity: 1 })
|
||||
})
|
||||
expect(s1.attr('offset')).toBe('14%')
|
||||
expect(s2.attr('offset')).toBe('91%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('update()', function() {
|
||||
|
||||
it('removes all existing children first', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at({ offset: 0.12, color: '#333', opacity: 1 })
|
||||
s2 = stop.at({ offset: 0.93, color: '#fff', opacity: 1 })
|
||||
})
|
||||
expect(gradient.children().length).toBe(2)
|
||||
gradient.update(function(stop) {
|
||||
s1 = stop.at({ offset: 0.33, color: '#666', opacity: 1 })
|
||||
s2 = stop.at({ offset: 1, color: '#000', opacity: 1 })
|
||||
})
|
||||
expect(gradient.children().length).toBe(2)
|
||||
})
|
||||
|
||||
it('accepts multiple aruments on fixed positions', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at(0.11, '#333')
|
||||
s2 = stop.at(0.94, '#fff', 0.5)
|
||||
})
|
||||
expect(gradient.children().length).toBe(2)
|
||||
expect(s1.attr('offset')).toBe(0.11)
|
||||
expect(s1.attr('stop-color')).toBe('#333333')
|
||||
expect(s2.attr('offset')).toBe(0.94)
|
||||
expect(s2.attr('stop-color')).toBe('#ffffff')
|
||||
expect(s2.attr('stop-opacity')).toBe(0.5)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('get()', function() {
|
||||
|
||||
it('returns the stop at a given index', function() {
|
||||
gradient = draw.gradient('linear', function(stop) {
|
||||
s1 = stop.at({ offset: 0.12, color: '#333', opacity: 1 })
|
||||
s2 = stop.at({ offset: 0.93, color: '#fff', opacity: 1 })
|
||||
})
|
||||
expect(gradient.get(0)).toBe(s1)
|
||||
expect(gradient.get(1)).toBe(s2)
|
||||
expect(gradient.get(2)).toBeNull()
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+116
@@ -0,0 +1,116 @@
|
||||
describe('Group', function() {
|
||||
var group
|
||||
|
||||
beforeEach(function() {
|
||||
group = draw.group().move(50, 50)
|
||||
group.rect(100,100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(group.x()).toBe(50)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
group.x(123)
|
||||
var box = group.gbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
it('sets the value of x correctly when called multiple times', function() {
|
||||
group.x(10).x(100).x(13)
|
||||
var box = group.gbox()
|
||||
expect(box.x).toBe(13)
|
||||
})
|
||||
it('sets the value of x correctly when the first argument is a string number', function(){
|
||||
group.x('123')
|
||||
var box = group.gbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(group.y()).toBe(50)
|
||||
})
|
||||
it('sets the value of y with the first argument', function() {
|
||||
group.y(345)
|
||||
var box = group.gbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
it('sets the value of y correctly when called multiple times', function() {
|
||||
group.y(1).y(10).y(15)
|
||||
var box = group.gbox()
|
||||
expect(box.y).toBe(15)
|
||||
})
|
||||
it('sets the value of y correctly when the first argument is a string number', function(){
|
||||
group.y('124')
|
||||
var box = group.gbox()
|
||||
expect(box.y).toBe(124)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(group.cx()).toBe(100)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
group.cx(123)
|
||||
var box = group.gbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(group.cy()).toBe(100)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
group.cy(345)
|
||||
var box = group.gbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
group.move(123,456)
|
||||
expect(group.node.getAttribute('transform')).toBe('matrix(1,0,0,1,123,456)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
group.center(321,567)
|
||||
var box = group.gbox()
|
||||
expect(box.cx).toBe(321)
|
||||
expect(box.cy).toBe(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
group.move(50,60)
|
||||
group.dx(100)
|
||||
expect(group.node.getAttribute('transform')).toBe('matrix(1,0,0,1,150,60)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
group.move(50,60)
|
||||
group.dy(120)
|
||||
expect(group.node.getAttribute('transform')).toBe('matrix(1,0,0,1,50,180)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
group.move(50, 60)
|
||||
group.dmove(80, 25)
|
||||
expect(group.node.getAttribute('transform')).toBe('matrix(1,0,0,1,130,85)')
|
||||
})
|
||||
})
|
||||
})
|
||||
+177
@@ -0,0 +1,177 @@
|
||||
// create canavs
|
||||
//var drawing, window = window, document = document, SVG = SVG
|
||||
|
||||
parserInDoc = false
|
||||
|
||||
if(typeof exports === 'object'){
|
||||
window = require('svgdom')
|
||||
SVG = require('../../dist/svg.js')
|
||||
document = window.document
|
||||
drawing = document.documentElement
|
||||
imageUrl = 'spec/fixtures/pixel.png'
|
||||
parserInDoc = true
|
||||
|
||||
function tag(name, attrs, children) {
|
||||
var el = document.createElement(name)
|
||||
for(var i in attrs){
|
||||
el.setAttribute(i, attrs[i])
|
||||
}
|
||||
|
||||
for(var i in children){
|
||||
if(typeof children[i] == 'string')
|
||||
children[i] = document.createTextNode(children[i])
|
||||
|
||||
el.appendChild(children[i])
|
||||
}
|
||||
|
||||
return el
|
||||
}
|
||||
|
||||
// create fixtures in svgdom
|
||||
var el = tag('svg', {
|
||||
height:0,
|
||||
width:0,
|
||||
id:'inlineSVG'
|
||||
},[
|
||||
tag('defs', {}, [
|
||||
tag('linearGradient', {}, [
|
||||
tag('stop', {offset: '5%', 'stop-color': 'green'}),
|
||||
tag('stop', {offset: '95%', 'stop-color': 'gold'}),
|
||||
]),
|
||||
tag('radialGradient', {}, [
|
||||
tag('stop', {offset: '5%', 'stop-color': 'green'}),
|
||||
tag('stop', {offset: '95%', 'stop-color': 'gold'}),
|
||||
])
|
||||
]),
|
||||
tag('desc', {}, ['Some description']),
|
||||
tag('path', {
|
||||
id: 'lineAB',
|
||||
d: 'M 100 350 l 150 -300',
|
||||
stroke: 'red',
|
||||
'stroke-width': '3',
|
||||
fill: 'none'
|
||||
}),
|
||||
tag('path', {
|
||||
id: 'lineBC',
|
||||
d: 'M 250 50 l 150 300',
|
||||
stroke: 'red',
|
||||
'stroke-width': '3',
|
||||
fill: 'none'
|
||||
}),
|
||||
tag('path', {
|
||||
d: 'M 175 200 l 150 0',
|
||||
stroke: 'green',
|
||||
'stroke-width': '3',
|
||||
fill: 'none'
|
||||
}),
|
||||
tag('path', {
|
||||
d: 'M 100 350 q 150 -300 300 0',
|
||||
stroke: 'blue',
|
||||
'stroke-width': '5',
|
||||
fill: 'none'
|
||||
}),
|
||||
tag('g', {
|
||||
stroke: 'black',
|
||||
'stroke-width': '2',
|
||||
fill: 'black',
|
||||
id: 'pointGroup'
|
||||
},[
|
||||
tag('circle', {
|
||||
id: 'pointA',
|
||||
cx: '100',
|
||||
cy: '350',
|
||||
r: '3',
|
||||
}),
|
||||
tag('circle', {
|
||||
id: 'pointB',
|
||||
cx: '250',
|
||||
cy: '50',
|
||||
r: '50',
|
||||
}),
|
||||
tag('circle', {
|
||||
id: 'pointC',
|
||||
cx: '400',
|
||||
cy: '350',
|
||||
r: '50',
|
||||
})
|
||||
]),
|
||||
tag('g', {
|
||||
'font-size': '30',
|
||||
font: 'sans-serif',
|
||||
fill: 'black',
|
||||
stroke: 'none',
|
||||
'text-anchor': 'middle',
|
||||
id: 'labelGroup'
|
||||
},[
|
||||
tag('text', {
|
||||
x: '100',
|
||||
y: '350',
|
||||
dy: '-30',
|
||||
}, ['A']),
|
||||
tag('text', {
|
||||
x: '250',
|
||||
y: '50',
|
||||
dy: '-10',
|
||||
}, ['B']),
|
||||
tag('text', {
|
||||
x: '400',
|
||||
y: '350',
|
||||
dx: '30',
|
||||
}, ['C'])
|
||||
]),
|
||||
tag('polygon', {points: '200,10 250,190 160,210'}),
|
||||
tag('polyline', {points: '20,20 40,25 60,40 80,120 120,140 200,180'})
|
||||
])
|
||||
|
||||
document.appendChild(el)
|
||||
|
||||
}else{
|
||||
drawing = document.createElement('div')
|
||||
document.getElementsByTagName('body')[0].appendChild(drawing)
|
||||
imageUrl = 'fixtures/pixel.png'
|
||||
}
|
||||
|
||||
parserInDoc |= 0
|
||||
drawing.id = 'drawing'
|
||||
draw = SVG(drawing).size(100,100)
|
||||
|
||||
parser = parserInDoc ? [SVG.parser.draw.instance] : []
|
||||
|
||||
// raw path data
|
||||
svgPath = 'M88.006,61.994c3.203,0,6.216-1.248,8.481-3.514C98.752,56.215,100,53.203,100,50c0-3.204-1.248-6.216-3.513-8.481 c-2.266-2.265-5.278-3.513-8.481-3.513c-2.687,0-5.237,0.877-7.327,2.496h-7.746l5.479-5.479 c5.891-0.757,10.457-5.803,10.457-11.896c0-6.614-5.381-11.995-11.994-11.995c-6.093,0-11.14,4.567-11.896,10.457l-5.479,5.479 v-7.747c1.618-2.089,2.495-4.641,2.495-7.327c0-3.204-1.247-6.216-3.513-8.481C56.216,1.248,53.204,0,50,0 c-3.204,0-6.216,1.248-8.481,3.513c-2.265,2.265-3.513,5.277-3.513,8.481c0,2.686,0.877,5.237,2.495,7.327v7.747l-5.479-5.479 c-0.757-5.89-5.803-10.457-11.896-10.457c-6.614,0-11.995,5.381-11.995,11.995c0,6.093,4.567,11.139,10.458,11.896l5.479,5.479 h-7.747c-2.089-1.619-4.641-2.496-7.327-2.496c-3.204,0-6.216,1.248-8.481,3.513C1.248,43.784,0,46.796,0,50 c0,3.203,1.248,6.216,3.513,8.48c2.265,2.266,5.277,3.514,8.481,3.514c2.686,0,5.237-0.877,7.327-2.496h7.747l-5.479,5.479 c-5.891,0.757-10.458,5.804-10.458,11.896c0,6.614,5.381,11.994,11.995,11.994c6.093,0,11.139-4.566,11.896-10.457l5.479-5.479 v7.749c-3.63,4.7-3.291,11.497,1.018,15.806C43.784,98.752,46.796,100,50,100c3.204,0,6.216-1.248,8.481-3.514 c4.309-4.309,4.647-11.105,1.018-15.806v-7.749l5.479,5.479c0.757,5.891,5.804,10.457,11.896,10.457 c6.613,0,11.994-5.38,11.994-11.994c0-6.093-4.566-11.14-10.457-11.896l-5.479-5.479h7.746 C82.769,61.117,85.319,61.994,88.006,61.994z M76.874,68.354c4.705,0,8.52,3.814,8.52,8.521c0,4.705-3.814,8.52-8.52,8.52 s-8.52-3.814-8.52-8.52l-12.33-12.33V81.98c3.327,3.328,3.327,8.723,0,12.049c-3.327,3.328-8.722,3.328-12.049,0 c-3.327-3.326-3.327-8.721,0-12.049V64.544l-12.33,12.33c0,4.705-3.814,8.52-8.52,8.52s-8.52-3.814-8.52-8.52 c0-4.706,3.814-8.521,8.52-8.521l12.33-12.33H18.019c-3.327,3.328-8.722,3.328-12.049,0c-3.327-3.326-3.327-8.721,0-12.048 s8.722-3.327,12.049,0h17.438l-12.33-12.33c-4.706,0-8.52-3.814-8.52-8.52c0-4.706,3.814-8.52,8.52-8.52s8.52,3.814,8.52,8.52 l12.33,12.33V18.019c-3.327-3.327-3.327-8.722,0-12.049s8.722-3.327,12.049,0s3.327,8.722,0,12.049v17.438l12.33-12.33 c0-4.706,3.814-8.52,8.52-8.52s8.52,3.814,8.52,8.52c0,4.705-3.814,8.52-8.52,8.52l-12.33,12.33h17.438 c3.327-3.327,8.722-3.327,12.049,0s3.327,8.722,0,12.048c-3.327,3.328-8.722,3.328-12.049,0H64.544L76.874,68.354z'
|
||||
|
||||
// image url
|
||||
|
||||
|
||||
// lorem ipsum text
|
||||
loremIpsum = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sodales\n imperdiet auctor. Nunc ultrices lectus at erat dictum pharetra\n elementum ante posuere. Duis turpis risus, blandit nec elementum et,\n posuere eget lacus. Aliquam et risus magna, eu aliquet nibh. Fusce\n consequat mi quis purus varius sagittis euismod urna interdum.\n Curabitur aliquet orci quis felis semper vulputate. Vestibulum ac nisi\n magna, id dictum diam. Proin sed metus vel magna blandit\n sodales. Pellentesque at neque ultricies nunc euismod rutrum ut in\n lorem. Mauris euismod tellus in tellus tempus interdum. Phasellus\n mattis sapien et leo feugiat dictum. Vestibulum at volutpat velit.'
|
||||
|
||||
beforeEach(function(){
|
||||
// test for touch device
|
||||
this.isTouchDevice = 'ontouchstart' in document.documentElement
|
||||
})
|
||||
|
||||
// strip spaces from result
|
||||
window.stripped = function(string) {
|
||||
string = string.replace(/\s+/g, '')
|
||||
if(string.slice(-1) == ';') string = string.slice(0, -1)
|
||||
return string
|
||||
}
|
||||
|
||||
// This is needed because of IE11 which uses space as a delimiter in matrix
|
||||
window.matrixStringToArray = function(source){
|
||||
return source
|
||||
.replace(/matrix\(|\)/, '')
|
||||
.split(SVG.regex.delimiter)
|
||||
.map(parseFloat)
|
||||
}
|
||||
|
||||
// This is needed because of IE11 creating values like 2.99999 when calculating a transformed box
|
||||
window.roundBox = function(box) {
|
||||
return new SVG.Box(
|
||||
Math.round(box.x),
|
||||
Math.round(box.y),
|
||||
Math.round(box.width),
|
||||
Math.round(box.height)
|
||||
)
|
||||
}
|
||||
+61
@@ -0,0 +1,61 @@
|
||||
describe('Hyperlink', function() {
|
||||
var link
|
||||
, url = 'http://svgjs.com'
|
||||
|
||||
beforeEach(function() {
|
||||
link = draw.link(url)
|
||||
link.rect(100,100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('creates a link', function() {
|
||||
expect(link.attr('href')).toBe(url)
|
||||
})
|
||||
|
||||
describe('to()', function() {
|
||||
it('creates xlink:href attribute', function() {
|
||||
link.to('http://apple.com')
|
||||
expect(link.attr('href')).toBe('http://apple.com')
|
||||
})
|
||||
})
|
||||
|
||||
describe('show()', function() {
|
||||
it('creates xlink:show attribute', function() {
|
||||
link.show('replace')
|
||||
expect(link.attr('show')).toBe('replace')
|
||||
})
|
||||
})
|
||||
|
||||
describe('target()', function() {
|
||||
it('creates target attribute', function() {
|
||||
link.target('_blank')
|
||||
expect(link.attr('target')).toBe('_blank')
|
||||
})
|
||||
})
|
||||
|
||||
describe('SVG.Element', function() {
|
||||
var element
|
||||
|
||||
beforeEach(function() {
|
||||
element = draw.rect(100,100)
|
||||
})
|
||||
|
||||
describe('linkTo()', function() {
|
||||
it('wraps the called element in a link with given url', function() {
|
||||
element.linkTo(url)
|
||||
expect(element.parent().attr('href')).toBe(url)
|
||||
})
|
||||
it('wraps the called element in a link with given block', function() {
|
||||
element.linkTo(function(link) {
|
||||
link.to(url).target('_blank')
|
||||
})
|
||||
expect(element.parent().attr('href')).toBe(url)
|
||||
expect(element.parent().attr('target')).toBe('_blank')
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+226
@@ -0,0 +1,226 @@
|
||||
describe('Image', function() {
|
||||
var image
|
||||
|
||||
beforeEach(function() {
|
||||
image = draw.image(imageUrl, 100, 100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
|
||||
describe('()', function() {
|
||||
it('should set width and height automatically if no size is given', function(done) {
|
||||
image = draw.image(imageUrl).loaded(function() {
|
||||
expect(image.node.getAttribute('height')).toBe('1')
|
||||
expect(image.node.getAttribute('width')).toBe('1')
|
||||
done()
|
||||
})
|
||||
})
|
||||
it('should set width and height if size is given', function(done) {
|
||||
image = draw.image(imageUrl, 100, 100).loaded(function() {
|
||||
expect(image.node.getAttribute('height')).toBe('100')
|
||||
expect(image.node.getAttribute('width')).toBe('100')
|
||||
done()
|
||||
})
|
||||
})
|
||||
it('returns itself when no url given', function() {
|
||||
var img = new SVG.Image()
|
||||
expect(img.load()).toBe(img)
|
||||
})
|
||||
})
|
||||
|
||||
describe('loaded()', function() {
|
||||
beforeEach(function(done) {
|
||||
loadCb = {cb: function(){ done() }}
|
||||
errorCb = jasmine.createSpy('errorCb')
|
||||
spyOn(loadCb, 'cb').and.callThrough()
|
||||
image = draw.image(imageUrl, 100, 100).loaded(loadCb.cb).error(errorCb)
|
||||
})
|
||||
|
||||
it('should set the load callback', function() {
|
||||
expect(image._loaded).toBe(loadCb.cb)
|
||||
})
|
||||
it('executes the load callback', function() {
|
||||
expect(loadCb.cb).toHaveBeenCalledWith({
|
||||
width: 1,
|
||||
height: 1,
|
||||
ratio: 1,
|
||||
url: jasmine.any(String)
|
||||
})
|
||||
})
|
||||
it('does not execute the error callback', function() {
|
||||
expect(errorCb).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
|
||||
describe('error()', function() {
|
||||
beforeEach(function(done) {
|
||||
loadCb = jasmine.createSpy('loadCb')
|
||||
errorCb = {cb: function(){ done() }}
|
||||
spyOn(errorCb, 'cb').and.callThrough()
|
||||
image = draw.image('not_existant.jpg', 100, 100).loaded(loadCb).error(errorCb.cb)
|
||||
})
|
||||
|
||||
it('should set the error callback', function() {
|
||||
expect(image._error).toBe(errorCb.cb)
|
||||
})
|
||||
it('executes the error callback', function() {
|
||||
expect(errorCb.cb).toHaveBeenCalledWith(jasmine.any(window.Event))
|
||||
})
|
||||
it('does not execute the load callback', function() {
|
||||
expect(loadCb).not.toHaveBeenCalled()
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('x()', function() {
|
||||
it('should return the value of x without an argument', function() {
|
||||
expect(image.x()).toBe(0)
|
||||
})
|
||||
it('should set the value of x with the first argument', function() {
|
||||
image.x(123)
|
||||
var box = image.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('should return the value of y without an argument', function() {
|
||||
expect(image.y()).toBe(0)
|
||||
})
|
||||
it('should set the value of y with the first argument', function() {
|
||||
image.y(345)
|
||||
var box = image.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('should return the value of cx without an argument', function() {
|
||||
expect(image.cx()).toBe(50)
|
||||
})
|
||||
it('should set the value of cx with the first argument', function() {
|
||||
image.cx(123)
|
||||
var box = image.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('should return the value of cy without an argument', function() {
|
||||
expect(image.cy()).toBe(50)
|
||||
})
|
||||
it('should set the value of cy with the first argument', function() {
|
||||
image.cy(345)
|
||||
var box = image.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('should set the x and y position', function() {
|
||||
image.move(123,456)
|
||||
expect(image.node.getAttribute('x')).toBe('123')
|
||||
expect(image.node.getAttribute('y')).toBe('456')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
image.move(50,60)
|
||||
image.dx(100)
|
||||
expect(image.node.getAttribute('x')).toBe('150')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
image.move(50,60)
|
||||
image.dy(120)
|
||||
expect(image.node.getAttribute('y')).toBe('180')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
image.move(50,60)
|
||||
image.dmove(80, 25)
|
||||
expect(image.node.getAttribute('x')).toBe('130')
|
||||
expect(image.node.getAttribute('y')).toBe('85')
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('should set the cx and cy position', function() {
|
||||
image.center(321,567)
|
||||
var box = image.bbox()
|
||||
expect(box.cx).toBe(321)
|
||||
expect(box.cy).toBe(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width of the element', function() {
|
||||
image.width(789)
|
||||
expect(image.node.getAttribute('width')).toBe('789')
|
||||
})
|
||||
it('gets the width of the element if the argument is null', function() {
|
||||
expect(image.width().toString()).toBe(image.node.getAttribute('width'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height of the element', function() {
|
||||
image.height(1236)
|
||||
expect(image.node.getAttribute('height')).toBe('1236')
|
||||
})
|
||||
it('gets the height of the element if the argument is null', function() {
|
||||
expect(image.height().toString()).toBe(image.node.getAttribute('height'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
image.size(987,654)
|
||||
expect(image.node.getAttribute('width')).toBe('987')
|
||||
expect(image.node.getAttribute('height')).toBe('654')
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = image.bbox()
|
||||
image.size(500)
|
||||
expect(image.width()).toBe(500)
|
||||
expect(image.width() / image.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = image.bbox()
|
||||
image.size(null, 525)
|
||||
expect(image.height()).toBe(525)
|
||||
expect(image.width() / image.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box = image.scale(2).rbox()
|
||||
|
||||
expect(box.width).toBe(image.attr('width') * 2)
|
||||
expect(box.height).toBe(image.attr('height') * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box = image.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box.width).toBe(image.attr('width') * 2)
|
||||
expect(box.height).toBe(image.attr('height') * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('should set the translation of an element', function() {
|
||||
image.transform({ x: 12, y: 12 })
|
||||
expect(image.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+244
@@ -0,0 +1,244 @@
|
||||
describe('Line', function() {
|
||||
var line
|
||||
|
||||
beforeEach(function() {
|
||||
line = draw.line(0,100,100,0)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
// #487
|
||||
describe('()', function(){
|
||||
it('will take an array as input', function(){
|
||||
line = draw.line([[0,100],[100,0]])
|
||||
var attrs = line.attr()
|
||||
expect(attrs.x1).toBe(0)
|
||||
expect(attrs.y1).toBe(100)
|
||||
expect(attrs.x2).toBe(100)
|
||||
expect(attrs.y2).toBe(0)
|
||||
})
|
||||
|
||||
it('falls back to a line with its two points at [0,0] without an argument', function() {
|
||||
line = draw.line()
|
||||
var attrs = line.attr()
|
||||
expect(attrs.x1).toBe(0)
|
||||
expect(attrs.y1).toBe(0)
|
||||
expect(attrs.x2).toBe(0)
|
||||
expect(attrs.y2).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('should return the value of x without an argument', function() {
|
||||
expect(line.x()).toBe(0)
|
||||
})
|
||||
it('should set the value of x with the first argument', function() {
|
||||
line.x(123)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('should return the value of y without an argument', function() {
|
||||
expect(line.y()).toBe(0)
|
||||
})
|
||||
it('should set the value of y with the first argument', function() {
|
||||
line.y(345)
|
||||
var box = line.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('should return the value of cx without an argument', function() {
|
||||
expect(line.cx()).toBe(50)
|
||||
})
|
||||
it('should set the value of cx with the first argument', function() {
|
||||
line.cx(123)
|
||||
var box = line.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('should return the value of cy without an argument', function() {
|
||||
expect(line.cy()).toBe(50)
|
||||
})
|
||||
it('should set the value of cy with the first argument', function() {
|
||||
line.cy(345)
|
||||
var box = line.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('should set the x and y position', function() {
|
||||
line.move(123,456)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
expect(box.y + box.height).toBe(556)
|
||||
expect(box.x + box.width).toBe(223)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
line.move(50,60)
|
||||
line.dx(100)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(150)
|
||||
expect(box.y + box.height).toBe(160)
|
||||
expect(box.x + box.width).toBe(250)
|
||||
expect(box.y).toBe(60)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
line.move(50, 60)
|
||||
line.dy(120)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(50)
|
||||
expect(box.y + box.height).toBe(280)
|
||||
expect(box.x + box.width).toBe(150)
|
||||
expect(box.y).toBe(180)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
line.move(50,60)
|
||||
line.dmove(80, 25)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(130)
|
||||
expect(box.y + box.height).toBe(185)
|
||||
expect(box.x + box.width).toBe(230)
|
||||
expect(box.y).toBe(85)
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('should set the cx and cy position', function() {
|
||||
line.center(321,567)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(271)
|
||||
expect(box.y + box.height).toBe(617)
|
||||
expect(box.x + box.width).toBe(371)
|
||||
expect(box.y).toBe(517)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width of the element', function() {
|
||||
line.width(400)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(0)
|
||||
expect(box.x + box.width).toBe(400)
|
||||
})
|
||||
it('get the width of the element without argument', function() {
|
||||
line.width(123)
|
||||
var box = line.bbox()
|
||||
expect(line.width()).toBe(box.width)
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height of the element', function() {
|
||||
line.height(300)
|
||||
var box = line.bbox()
|
||||
expect(box.y).toBe(0)
|
||||
expect(box.y + box.height).toBe(300)
|
||||
})
|
||||
it('gets the height of the element without argument', function() {
|
||||
line.height(456)
|
||||
var box = line.bbox()
|
||||
expect(line.height()).toBe(box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
line.size(987,654)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(0)
|
||||
expect(box.y + box.height).toBe(654)
|
||||
expect(box.x + box.width).toBe(987)
|
||||
expect(box.y).toBe(0)
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = line.bbox()
|
||||
line.size(500)
|
||||
expect(line.width()).toBe(500)
|
||||
expect(line.width() / line.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = line.bbox()
|
||||
line.size(null, 525)
|
||||
expect(line.height()).toBe(525)
|
||||
expect(line.width() / line.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box1 = line.rbox()
|
||||
, box2 = line.scale(2).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box1 = line.rbox()
|
||||
, box2 = line.scale(2,3.5).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('should set the translation of an element', function() {
|
||||
line.transform({ x: 12, y: 12 })
|
||||
expect(line.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plot()', function() {
|
||||
it('should update the start and end points', function() {
|
||||
line.plot(100,200,300,400)
|
||||
var box = line.bbox()
|
||||
expect(box.x).toBe(100)
|
||||
expect(box.y).toBe(200)
|
||||
expect(box.x + box.width).toBe(300)
|
||||
expect(box.y + box.height).toBe(400)
|
||||
})
|
||||
it('change the x1,y1,x2,y2 attributes of the underlying line node when a string is passed', function() {
|
||||
expect(line.plot('100,50 200,10')).toBe(line)
|
||||
|
||||
var attrs = line.attr()
|
||||
expect(attrs.x1).toBe(100)
|
||||
expect(attrs.y1).toBe(50)
|
||||
expect(attrs.x2).toBe(200)
|
||||
expect(attrs.y2).toBe(10)
|
||||
})
|
||||
it('change the x1,y1,x2,y2 attributes of the underlying line node when 4 numbers are passed', function() {
|
||||
expect(line.plot(45, 24, 220, 300)).toBe(line)
|
||||
|
||||
var attrs = line.attr()
|
||||
expect(attrs.x1).toBe(45)
|
||||
expect(attrs.y1).toBe(24)
|
||||
expect(attrs.x2).toBe(220)
|
||||
expect(attrs.y2).toBe(300)
|
||||
})
|
||||
it('return the coordinates in a point array when no arguments are passed', function () {
|
||||
var attrs = line.attr()
|
||||
, pointArray = new SVG.PointArray([[attrs.x1, attrs.y1], [attrs.x2, attrs.y2]])
|
||||
|
||||
expect(line.plot()).toEqual(pointArray)
|
||||
})
|
||||
})
|
||||
})
|
||||
+89
@@ -0,0 +1,89 @@
|
||||
describe('Marker', function() {
|
||||
|
||||
describe('on a container element', function() {
|
||||
var marker
|
||||
|
||||
beforeEach(function() {
|
||||
marker = draw.marker(10, 12, function(add) {
|
||||
add.rect(10, 12)
|
||||
|
||||
this.ref(5, 6)
|
||||
})
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Marker', function() {
|
||||
expect(marker instanceof SVG.Marker).toBeTruthy()
|
||||
})
|
||||
|
||||
it('creates marker in defs', function() {
|
||||
expect(marker.parent() instanceof SVG.Defs).toBeTruthy()
|
||||
})
|
||||
|
||||
describe('marker()', function() {
|
||||
it('returns the marker element', function() {
|
||||
expect(marker = draw.marker(10, 12)).toBe(marker)
|
||||
})
|
||||
it('sets the refX to half of the given width', function() {
|
||||
marker = draw.marker(10, 12)
|
||||
expect(marker.node.getAttribute('refX')).toBe('5')
|
||||
})
|
||||
it('sets the refY to half of the given height', function() {
|
||||
marker = draw.marker(13, 15)
|
||||
expect(marker.node.getAttribute('refY')).toBe('7.5')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('on a target path', function() {
|
||||
var path, marker
|
||||
|
||||
beforeEach(function() {
|
||||
path = draw.path('M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100')
|
||||
|
||||
path.marker('mid', 10, 12, function(add) {
|
||||
add.rect(10, 12)
|
||||
|
||||
this.ref(5, 6)
|
||||
})
|
||||
|
||||
marker = path.marker('mid', 10, 10)
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Marker', function() {
|
||||
expect(path.reference('marker-mid') instanceof SVG.Marker).toBeTruthy()
|
||||
})
|
||||
|
||||
describe('marker()', function() {
|
||||
it('returns the target element', function() {
|
||||
expect(path.marker('start', 10, 12)).toBe(path)
|
||||
})
|
||||
it('creates a marker and applies it to the marker-start attribute', function() {
|
||||
path.marker('start', 10, 12)
|
||||
marker = path.reference('marker-start')
|
||||
|
||||
expect(path.node.getAttribute('marker-start')).toBe(marker.toString())
|
||||
})
|
||||
it('creates a marker and applies it to the marker-mid attribute', function() {
|
||||
path.marker('mid', 10, 12)
|
||||
marker = path.reference('marker-mid')
|
||||
|
||||
expect(path.node.getAttribute('marker-mid')).toBe(marker.toString())
|
||||
})
|
||||
it('creates a marker and applies it to the marker-end attribute', function() {
|
||||
path.marker('end', 10, 12)
|
||||
marker = path.reference('marker-end')
|
||||
|
||||
expect(path.node.getAttribute('marker-end')).toBe(marker.toString())
|
||||
})
|
||||
it('accepts an instance of an existing marker element as the second argument', function() {
|
||||
marker = draw.marker(11, 11)
|
||||
path.marker('mid', marker)
|
||||
|
||||
expect(path.node.getAttribute('marker-mid')).toBe(marker.toString())
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
})
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
describe('Mask', function() {
|
||||
var rect, circle
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
circle = draw.circle(100).move(50, 50).fill('#fff')
|
||||
rect.maskWith(circle)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('moves the masking element to a new mask node', function() {
|
||||
expect(circle.parent() instanceof SVG.Mask).toBe(true)
|
||||
})
|
||||
|
||||
it('creates the mask node in the defs node', function() {
|
||||
expect(circle.parent().parent()).toBe(draw.defs())
|
||||
})
|
||||
|
||||
it('sets the "mask" attribute on the masked element with the mask id', function() {
|
||||
expect(rect.attr('mask')).toBe('url("#' + circle.parent().attr('id') + '")')
|
||||
})
|
||||
|
||||
it('references the mask element in the masked element', function() {
|
||||
expect(rect.masker).toBe(circle.parent())
|
||||
})
|
||||
|
||||
it('references the masked element in the mask target list', function() {
|
||||
expect(rect.masker.targets.indexOf(rect) > -1).toBe(true)
|
||||
})
|
||||
|
||||
it('reuses mask element when mask was given', function() {
|
||||
var mask = rect.masker
|
||||
expect(draw.rect(100,100).maskWith(mask).masker).toBe(mask)
|
||||
})
|
||||
|
||||
it('unmasks all masked elements when being removed', function() {
|
||||
rect.masker.remove()
|
||||
expect(rect.attr('mask')).toBe(undefined)
|
||||
})
|
||||
|
||||
describe('unmask()', function() {
|
||||
|
||||
it('clears the "mask" attribute on the masked element', function() {
|
||||
rect.unmask()
|
||||
expect(rect.attr('mask')).toBe(undefined)
|
||||
})
|
||||
|
||||
it('removes the reference to the masking element', function() {
|
||||
rect.unmask()
|
||||
expect(rect.masker).toBe(undefined)
|
||||
})
|
||||
|
||||
it('returns the element itslef', function() {
|
||||
expect(rect.unmask()).toBe(rect)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+471
@@ -0,0 +1,471 @@
|
||||
describe('Matrix', function() {
|
||||
var matrix
|
||||
|
||||
describe('initialization', function() {
|
||||
|
||||
describe('without a source', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
matrix = new SVG.Matrix
|
||||
})
|
||||
|
||||
it('creates a new matrix with default values', function() {
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(0)
|
||||
expect(matrix.f).toBe(0)
|
||||
})
|
||||
|
||||
describe('extract()', function() {
|
||||
var extract
|
||||
|
||||
beforeEach(function() {
|
||||
extract = matrix.extract()
|
||||
})
|
||||
|
||||
it('parses translation values', function() {
|
||||
expect(extract.x).toBe(0)
|
||||
expect(extract.y).toBe(0)
|
||||
})
|
||||
it('parses skew values', function() {
|
||||
expect(extract.skewX).toBe(0)
|
||||
expect(extract.skewY).toBe(0)
|
||||
})
|
||||
it('parses scale values', function() {
|
||||
expect(extract.scaleX).toBe(1)
|
||||
expect(extract.scaleY).toBe(1)
|
||||
})
|
||||
it('parses rotatoin value', function() {
|
||||
expect(extract.rotation).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('toString()' , function() {
|
||||
it('exports correctly to a string', function() {
|
||||
expect(matrix.toString()).toBe('matrix(1,0,0,1,0,0)')
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('with an element given', function() {
|
||||
var rect
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100, 100)
|
||||
.transform({ rotation: -10 }, true)
|
||||
.transform({ x: 40, y: 50 }, true)
|
||||
.transform({ scale: 2 }, true)
|
||||
|
||||
matrix = new SVG.Matrix(rect)
|
||||
})
|
||||
|
||||
it('parses the current transform matrix from an element', function() {
|
||||
expect(matrix.a).toBeCloseTo(1.9696155786514282)
|
||||
expect(matrix.b).toBeCloseTo(-0.3472963869571686)
|
||||
expect(matrix.c).toBeCloseTo(0.3472963869571686)
|
||||
expect(matrix.d).toBeCloseTo(1.9696155786514282)
|
||||
expect(matrix.e).toBeCloseTo(-17.770875930786133)
|
||||
expect(matrix.f).toBeCloseTo(11.178505897521973)
|
||||
})
|
||||
|
||||
describe('extract()', function() {
|
||||
|
||||
it('parses translation values', function() {
|
||||
var extract = new SVG.Matrix(draw.rect(100, 100).translate(40, 50)).extract()
|
||||
expect(extract.x).toBeCloseTo(40)
|
||||
expect(extract.y).toBeCloseTo(50)
|
||||
})
|
||||
it('parses skewX value', function() {
|
||||
var extract = new SVG.Matrix(draw.rect(100, 100).skew(25, 0)).extract()
|
||||
expect(extract.skewX).toBeCloseTo(25)
|
||||
})
|
||||
it('parses skewY value', function() {
|
||||
var extract = new SVG.Matrix(draw.rect(100, 100).skew(0, 20)).extract()
|
||||
expect(extract.skewY).toBeCloseTo(20)
|
||||
})
|
||||
it('parses scale values', function() {
|
||||
var extract = new SVG.Matrix(draw.rect(100, 100).scale(2, 3)).extract()
|
||||
expect(extract.scaleX).toBeCloseTo(2)
|
||||
expect(extract.scaleY).toBeCloseTo(3)
|
||||
})
|
||||
it('parses rotatoin value', function() {
|
||||
var extract = new SVG.Matrix(draw.rect(100, 100).rotate(-100)).extract()
|
||||
expect(extract.rotation).toBeCloseTo(-100)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('with a string given', function() {
|
||||
it('parses the string value correctly', function() {
|
||||
var matrix = new SVG.Matrix('2, 0, 0, 2, 100, 50')
|
||||
|
||||
expect(matrix.a).toBe(2)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(2)
|
||||
expect(matrix.e).toBe(100)
|
||||
expect(matrix.f).toBe(50)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with an array given', function() {
|
||||
it('parses the array correctly', function() {
|
||||
var matrix = new SVG.Matrix([2, 0, 0, 2, 100, 50])
|
||||
|
||||
expect(matrix.a).toBe(2)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(2)
|
||||
expect(matrix.e).toBe(100)
|
||||
expect(matrix.f).toBe(50)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with an object given', function() {
|
||||
it('parses the object correctly', function() {
|
||||
var matrix = new SVG.Matrix({a:2, b:0, c:0, d:2, e:100, f:50})
|
||||
|
||||
expect(matrix.a).toBe(2)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(2)
|
||||
expect(matrix.e).toBe(100)
|
||||
expect(matrix.f).toBe(50)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with 6 arguments given', function() {
|
||||
it('parses the arguments correctly', function() {
|
||||
var matrix = new SVG.Matrix(2, 0, 0, 2, 100, 50)
|
||||
|
||||
expect(matrix.a).toBe(2)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(2)
|
||||
expect(matrix.e).toBe(100)
|
||||
expect(matrix.f).toBe(50)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('clone()', function() {
|
||||
it('returns a clone of the matrix', function() {
|
||||
var matrix = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, clone = matrix.clone()
|
||||
expect(matrix).not.toBe(clone)
|
||||
for(var i in 'abcdef') {
|
||||
expect(matrix[i]).toEqual(clone[i])
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('stores a given matrix for morphing', function() {
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, matrix2 = new SVG.Matrix(1, 0, 0, 1, 4, 3)
|
||||
|
||||
matrix1.morph(matrix2)
|
||||
|
||||
expect(matrix1.destination).toEqual(matrix2)
|
||||
})
|
||||
it('stores a clone, not the given matrix itself', function() {
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, matrix2 = new SVG.Matrix(1, 0, 0, 1, 4, 3)
|
||||
|
||||
matrix1.morph(matrix2)
|
||||
|
||||
expect(matrix1.destination).not.toBe(matrix2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('returns a morphed array at a given position', function() {
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, matrix2 = new SVG.Matrix(1, 0, 0, 1, 4, 3)
|
||||
, matrix3 = matrix1.morph(matrix2).at(0.5)
|
||||
|
||||
expect(matrix1.toString()).toBe('matrix(2,0,0,5,0,0)')
|
||||
expect(matrix2.toString()).toBe('matrix(1,0,0,1,4,3)')
|
||||
expect(matrix3.toString()).toBe('matrix(1.5,0,0,3,2,1.5)')
|
||||
})
|
||||
it('returns itself when no destination specified', function() {
|
||||
var matrix = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
expect(matrix.at(0.5)).toBe(matrix)
|
||||
})
|
||||
})
|
||||
|
||||
describe('multiply()', function() {
|
||||
it('multiplies two matices', function() {
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, matrix2 = new SVG.Matrix(1, 0, 0, 1, 4, 3)
|
||||
, matrix3 = matrix1.multiply(matrix2)
|
||||
|
||||
expect(matrix1.toString()).toBe('matrix(2,0,0,5,0,0)')
|
||||
expect(matrix2.toString()).toBe('matrix(1,0,0,1,4,3)')
|
||||
expect(matrix3.toString()).toBe('matrix(2,0,0,5,8,15)')
|
||||
})
|
||||
it('accepts matrices in any form', function() {
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 0, 0)
|
||||
, matrix2 = matrix1.multiply('1,0,0,1,4,3')
|
||||
|
||||
expect(matrix1.toString()).toBe('matrix(2,0,0,5,0,0)')
|
||||
expect(matrix2.toString()).toBe('matrix(2,0,0,5,8,15)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('inverse()', function() {
|
||||
it('inverses matrix', function() {
|
||||
|
||||
var matrix1 = new SVG.Matrix(2, 0, 0, 5, 4, 3)
|
||||
, matrix2 = matrix1.inverse()
|
||||
, abcdef = [0.5,0,0,0.2,-2,-0.6]
|
||||
|
||||
expect(matrix1.toString()).toBe('matrix(2,0,0,5,4,3)')
|
||||
|
||||
for(var i in 'abcdef') {
|
||||
expect(matrix2['abcdef'[i]]).toBeCloseTo(abcdef[i])
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('translates matrix by given x and y values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).translate(10, 12.5)
|
||||
|
||||
expect(matrix.e).toBe(14)
|
||||
expect(matrix.f).toBe(15.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('performs a uniformal scale with one value', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(3)
|
||||
|
||||
expect(matrix.a).toBe(3)
|
||||
expect(matrix.d).toBe(3)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a non-uniformal scale with two values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(2.5, 3.5)
|
||||
|
||||
expect(matrix.a).toBe(2.5)
|
||||
expect(matrix.d).toBe(3.5)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a uniformal scale at a given center point with three values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(3, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(3)
|
||||
expect(matrix.d).toBe(3)
|
||||
expect(matrix.e).toBe(-296)
|
||||
expect(matrix.f).toBe(-197)
|
||||
})
|
||||
it('performs a non-uniformal scale at a given center point with four values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).scale(3, 2, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(3)
|
||||
expect(matrix.d).toBe(2)
|
||||
expect(matrix.e).toBe(-296)
|
||||
expect(matrix.f).toBe(-97)
|
||||
})
|
||||
})
|
||||
|
||||
describe('rotate()', function() {
|
||||
it('performs a rotation with one argument', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).rotate(30)
|
||||
|
||||
expect(matrix.a).toBeCloseTo(0.8660254037844387)
|
||||
expect(matrix.d).toBeCloseTo(0.8660254037844387)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a rotation on a given point with three arguments', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).rotate(30, 150, 100)
|
||||
|
||||
expect(matrix.a).toBeCloseTo(0.8660254037844387)
|
||||
expect(matrix.d).toBeCloseTo(0.8660254037844387)
|
||||
expect(matrix.e).toBeCloseTo(74.0961894323342)
|
||||
expect(matrix.f).toBeCloseTo(-58.60254037844388)
|
||||
})
|
||||
})
|
||||
|
||||
describe('flip()', function() {
|
||||
describe('with x given', function() {
|
||||
it('performs a flip over the horizontal axis with one argument', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('x')
|
||||
|
||||
expect(matrix.a).toBe(-1)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a flip over the horizontal axis over a given point with two arguments', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('x', 150)
|
||||
|
||||
expect(matrix.a).toBe(-1)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(304)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
})
|
||||
describe('with y given', function() {
|
||||
it('performs a flip over the vertical axis with one argument', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('y')
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.d).toBe(-1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a flip over the vertical axis over a given point with two arguments', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip('y', 100)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.d).toBe(-1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(203)
|
||||
})
|
||||
})
|
||||
describe('with no axis given', function() {
|
||||
it('performs a flip over the horizontal and vertical axis with no argument', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip()
|
||||
|
||||
expect(matrix.a).toBe(-1)
|
||||
expect(matrix.d).toBe(-1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a flip over the horizontal and vertical axis over a given point with one argument that represent both coordinates', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip(100)
|
||||
|
||||
expect(matrix.a).toBe(-1)
|
||||
expect(matrix.d).toBe(-1)
|
||||
expect(matrix.e).toBe(204)
|
||||
expect(matrix.f).toBe(203)
|
||||
})
|
||||
it('performs a flip over the horizontal and vertical axis over a given point with two arguments', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).flip(50, 100)
|
||||
|
||||
expect(matrix.a).toBe(-1)
|
||||
expect(matrix.d).toBe(-1)
|
||||
expect(matrix.e).toBe(104)
|
||||
expect(matrix.f).toBe(203)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('skew()', function() {
|
||||
it('performs a uniformal skew with one value', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(14)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.24932800284318)
|
||||
expect(matrix.c).toBeCloseTo(0.24932800284318)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a non-uniformal skew with two values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(8, 5)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.087488663525924)
|
||||
expect(matrix.c).toBeCloseTo(0.14054083470239)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
it('performs a uniformal skew at a given center point with three values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(3, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.052407779283041)
|
||||
expect(matrix.c).toBeCloseTo(0.052407779283041)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBeCloseTo(-1.2407779283)
|
||||
expect(matrix.f).toBeCloseTo(-4.8611668924562)
|
||||
})
|
||||
it('performs a non-uniformal skew at a given center point with four values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(9, 7, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.1227845609029)
|
||||
expect(matrix.c).toBeCloseTo(0.15838444032454)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBeCloseTo(-11.83844403245)
|
||||
expect(matrix.f).toBeCloseTo(-15.417684135435)
|
||||
})
|
||||
it('can be chained', function(){
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skew(9, 7).skew(20, 40)
|
||||
|
||||
expect(matrix.a).toBeCloseTo(1.1329003254605)
|
||||
expect(matrix.b).toBeCloseTo(0.96188419208018)
|
||||
expect(matrix.c).toBeCloseTo(0.52235467459074)
|
||||
expect(matrix.d).toBeCloseTo(1.0446899253961)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('skewX', function(){
|
||||
it('performs a skew along the x axis with one value', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewX(12)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBeCloseTo(0.21255656167002)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
|
||||
it('performs a skew along the x axis at a given center point with three values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewX(5, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBe(0)
|
||||
expect(matrix.c).toBeCloseTo(0.087488663525924)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBeCloseTo(-4.74886635259)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('skewY', function(){
|
||||
it('performs a skew along the y axis with one value', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewY(12)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.21255656167002)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBe(3)
|
||||
})
|
||||
|
||||
it('performs a skew along the y axis at a given center point with three values', function() {
|
||||
var matrix = new SVG.Matrix(1, 0, 0, 1, 4, 3).skewY(5, 150, 100)
|
||||
|
||||
expect(matrix.a).toBe(1)
|
||||
expect(matrix.b).toBeCloseTo(0.087488663525924)
|
||||
expect(matrix.c).toBe(0)
|
||||
expect(matrix.d).toBe(1)
|
||||
expect(matrix.e).toBe(4)
|
||||
expect(matrix.f).toBeCloseTo(-10.123299528889)
|
||||
})
|
||||
})
|
||||
|
||||
describe('native()', function() {
|
||||
it('returns the node reference', function() {
|
||||
expect(new SVG.Matrix().native() instanceof window.SVGMatrix).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+58
@@ -0,0 +1,58 @@
|
||||
describe('Memory', function () {
|
||||
var rect, circle
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,120)
|
||||
circle = draw.circle(100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('remember()', function() {
|
||||
it('accepts an object with values', function() {
|
||||
rect.remember({ some: {cool:'and',nested:'stuff',foo:5} })
|
||||
expect(rect.remember('some').foo).toBe(5)
|
||||
})
|
||||
it('accepts key / value arguments', function() {
|
||||
rect.remember('fill', rect.attr('fill'))
|
||||
rect.fill('#f09')
|
||||
expect(rect.remember('fill')).toBe('#000000')
|
||||
})
|
||||
it('acts as a getter with one string argument', function() {
|
||||
rect.remember('opacity', 0.85)
|
||||
expect(rect.remember('opacity')).toBe(0.85)
|
||||
})
|
||||
it('saves values to individual objects', function() {
|
||||
rect.remember('opacity', 0.85)
|
||||
circle.remember('opacity', 0.5)
|
||||
expect(rect.remember('opacity')).toBe(0.85)
|
||||
expect(circle.remember('opacity')).toBe(0.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('forget()', function() {
|
||||
it('deletes a given memory', function() {
|
||||
rect.remember({ grass: 'is green', one: 1 })
|
||||
rect.forget('grass')
|
||||
expect(rect.remember('grass')).toBe(undefined)
|
||||
expect(rect.remember('one')).toBe(1)
|
||||
})
|
||||
it('accepts multiple arguments as different memories', function() {
|
||||
rect.remember({ grass: 'might be purple', two: 2, sea: true })
|
||||
rect.forget('grass', 'sea')
|
||||
expect(rect.remember('grass')).toBe(undefined)
|
||||
expect(rect.remember('sea')).toBe(undefined)
|
||||
expect(rect.remember('two')).toBe(2)
|
||||
})
|
||||
it('clears the whole memory without arguments', function() {
|
||||
rect.remember({ grass: 'is never pink', three: 3, tree: true })
|
||||
rect.forget()
|
||||
expect(rect.remember('grass')).toBe(undefined)
|
||||
expect(rect.remember('tree')).toBe(undefined)
|
||||
expect(rect.remember('three')).toBe(undefined)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
describe('Nested', function() {
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('()', function() {
|
||||
it('creates a nested svg of type SVG.Nested', function() {
|
||||
expect(draw.nested() instanceof SVG.Nested).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+245
@@ -0,0 +1,245 @@
|
||||
describe('Number', function() {
|
||||
var number
|
||||
|
||||
beforeEach(function() {
|
||||
number = new SVG.Number
|
||||
})
|
||||
|
||||
describe('new', function() {
|
||||
it('is zero', function() {
|
||||
expect(number.value).toBe(0)
|
||||
})
|
||||
it('has a blank unit', function() {
|
||||
expect(number.unit).toBe('')
|
||||
})
|
||||
it('accepts the unit as a second argument', function() {
|
||||
number = new SVG.Number(30, '%')
|
||||
expect(number.value).toBe(30)
|
||||
expect(number.unit).toBe('%')
|
||||
})
|
||||
it('parses a pixel value', function() {
|
||||
number = new SVG.Number('20px')
|
||||
expect(number.value).toBe(20)
|
||||
expect(number.unit).toBe('px')
|
||||
})
|
||||
it('parses a percent value', function() {
|
||||
number = new SVG.Number('99%')
|
||||
expect(number.value).toBe(0.99)
|
||||
expect(number.unit).toBe('%')
|
||||
})
|
||||
it('parses a seconds value', function() {
|
||||
number = new SVG.Number('2s')
|
||||
expect(number.value).toBe(2000)
|
||||
expect(number.unit).toBe('s')
|
||||
})
|
||||
it('parses a negative percent value', function() {
|
||||
number = new SVG.Number('-89%')
|
||||
expect(number.value).toBe(-0.89)
|
||||
expect(number.unit).toBe('%')
|
||||
})
|
||||
it('falls back to 0 if given value is NaN', function() {
|
||||
number = new SVG.Number(NaN)
|
||||
expect(number.value).toBe(0)
|
||||
})
|
||||
it('falls back to maximum value if given number is positive infinite', function() {
|
||||
number = new SVG.Number(1.7976931348623157E+10308)
|
||||
expect(number.value).toBe(3.4e+38)
|
||||
})
|
||||
it('falls back to minimum value if given number is negative infinite', function() {
|
||||
number = new SVG.Number(-1.7976931348623157E+10308)
|
||||
expect(number.value).toBe(-3.4e+38)
|
||||
})
|
||||
})
|
||||
|
||||
describe('toString()', function() {
|
||||
it('converts the number to a string', function() {
|
||||
expect(number.toString()).toBe('0')
|
||||
})
|
||||
it('appends the unit', function() {
|
||||
number.value = 1.21
|
||||
number.unit = 'px'
|
||||
expect(number.toString()).toBe('1.21px')
|
||||
})
|
||||
it('converts percent values properly', function() {
|
||||
number.value = 1.36
|
||||
number.unit = '%'
|
||||
expect(number.toString()).toBe('136%')
|
||||
})
|
||||
it('converts second values properly', function() {
|
||||
number.value = 2500
|
||||
number.unit = 's'
|
||||
expect(number.toString()).toBe('2.5s')
|
||||
})
|
||||
})
|
||||
|
||||
describe('valueOf()', function() {
|
||||
it('returns a numeric value for default units', function() {
|
||||
expect(typeof number.valueOf()).toBe('number')
|
||||
number = new SVG.Number('12')
|
||||
expect(typeof number.valueOf()).toBe('number')
|
||||
number = new SVG.Number(13)
|
||||
expect(typeof number.valueOf()).toBe('number')
|
||||
})
|
||||
it('returns a numeric value for pixel units', function() {
|
||||
number = new SVG.Number('10px')
|
||||
expect(typeof number.valueOf()).toBe('number')
|
||||
})
|
||||
it('returns a numeric value for percent units', function() {
|
||||
number = new SVG.Number('20%')
|
||||
expect(typeof number.valueOf()).toBe('number')
|
||||
})
|
||||
it('converts to a primitive when multiplying', function() {
|
||||
number.value = 80
|
||||
expect(number * 4).toBe(320)
|
||||
})
|
||||
})
|
||||
|
||||
describe('to()', function() {
|
||||
beforeEach(function() {
|
||||
number = number.plus(4)
|
||||
})
|
||||
it('returns a new instance', function() {
|
||||
expect(number.to('em')).not.toBe(number)
|
||||
expect(number.to('em') instanceof SVG.Number).toBeTruthy()
|
||||
})
|
||||
it('changes the unit value', function() {
|
||||
number = number.to('%')
|
||||
expect(number.unit).toBe('%')
|
||||
})
|
||||
it('changes the output value', function() {
|
||||
var oldNumber = number.valueOf()
|
||||
number = number.to('%')
|
||||
expect(number.toString()).toBe('400%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plus()', function() {
|
||||
it('returns a new instance', function() {
|
||||
expect(number.plus(4.5)).not.toBe(number)
|
||||
expect(number.plus(4.5) instanceof SVG.Number).toBeTruthy()
|
||||
})
|
||||
it('adds a given number', function() {
|
||||
expect(number.plus(3.5).valueOf()).toBe(3.5)
|
||||
})
|
||||
it('adds a given percentage value', function() {
|
||||
expect(number.plus('225%').valueOf()).toBe(2.25)
|
||||
})
|
||||
it('adds a given pixel value', function() {
|
||||
expect(number.plus('83px').valueOf()).toBe(83)
|
||||
})
|
||||
it('use the unit of this number as the unit of the returned number by default', function (){
|
||||
expect(new SVG.Number('12s').plus('3%').unit).toBe('s')
|
||||
})
|
||||
it('use the unit of the passed number as the unit of the returned number when this number as no unit', function() {
|
||||
expect(number.plus('15%').unit).toBe('%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('minus()', function() {
|
||||
it('subtracts a given number', function() {
|
||||
expect(number.minus(3.7).valueOf()).toBe(-3.7)
|
||||
})
|
||||
it('subtracts a given percentage value', function() {
|
||||
expect(number.minus('223%').valueOf()).toBe(-2.23)
|
||||
})
|
||||
it('subtracts a given pixel value', function() {
|
||||
expect(number.minus('85px').valueOf()).toBe(-85)
|
||||
})
|
||||
it('use the unit of this number as the unit of the returned number by default', function (){
|
||||
expect(new SVG.Number('12s').minus('3%').unit).toBe('s')
|
||||
})
|
||||
it('use the unit of the passed number as the unit of the returned number when this number as no unit', function() {
|
||||
expect(number.minus('15%').unit).toBe('%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('times()', function() {
|
||||
beforeEach(function() {
|
||||
number = number.plus(4)
|
||||
})
|
||||
it('multiplies with a given number', function() {
|
||||
expect(number.times(3).valueOf()).toBe(12)
|
||||
})
|
||||
it('multiplies with a given percentage value', function() {
|
||||
expect(number.times('110%').valueOf()).toBe(4.4)
|
||||
})
|
||||
it('multiplies with a given pixel value', function() {
|
||||
expect(number.times('85px').valueOf()).toBe(340)
|
||||
})
|
||||
it('use the unit of this number as the unit of the returned number by default', function (){
|
||||
expect(new SVG.Number('12s').times('3%').unit).toBe('s')
|
||||
})
|
||||
it('use the unit of the passed number as the unit of the returned number when this number as no unit', function() {
|
||||
expect(number.times('15%').unit).toBe('%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('divide()', function() {
|
||||
beforeEach(function() {
|
||||
number = number.plus(90)
|
||||
})
|
||||
it('divides by a given number', function() {
|
||||
expect(number.divide(3).valueOf()).toBe(30)
|
||||
})
|
||||
it('divides by a given percentage value', function() {
|
||||
expect(number.divide('3000%').valueOf()).toBe(3)
|
||||
})
|
||||
it('divides by a given pixel value', function() {
|
||||
expect(number.divide('45px').valueOf()).toBe(2)
|
||||
})
|
||||
it('use the unit of this number as the unit of the returned number by default', function (){
|
||||
expect(new SVG.Number('12s').divide('3%').unit).toBe('s')
|
||||
})
|
||||
it('use the unit of the passed number as the unit of the returned number when this number as no unit', function() {
|
||||
expect(number.divide('15%').unit).toBe('%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('returns itself', function() {
|
||||
expect(number.morph(new SVG.Number)).toBe(number)
|
||||
})
|
||||
it('prepares the color for morphing', function() {
|
||||
var destination = new SVG.Number
|
||||
number.morph(destination)
|
||||
expect(number.destination).toEqual(destination)
|
||||
})
|
||||
it('if the passed object as a relative attribute set to true, destination is relative to the current value', function() {
|
||||
var n1 = new SVG.Number(3)
|
||||
, n2 = new SVG.Number(7)
|
||||
|
||||
n2.relative = true
|
||||
n1.morph(n2)
|
||||
expect(n1.destination.value).toBe(n1.value + n2.value)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('returns a new instance', function() {
|
||||
var destination = new SVG.Number(200)
|
||||
var morphed = number.morph(destination).at(0.4)
|
||||
expect(morphed).not.toBe(number)
|
||||
expect(morphed).not.toBe(destination)
|
||||
})
|
||||
it('morphes number to a given position', function() {
|
||||
var destination = new SVG.Number(200)
|
||||
var morphed = number.morph(destination).at(0.4)
|
||||
expect(morphed.valueOf()).toBe(80)
|
||||
})
|
||||
it('morphes number to a given percentage position', function() {
|
||||
var destination = new SVG.Number('100%')
|
||||
var morphed = number.morph(destination).at(0.72)
|
||||
expect(morphed.toString()).toBe('72%')
|
||||
})
|
||||
it('use the unit of the destination number as the unit of the returned number by default', function() {
|
||||
expect(new SVG.Number('100s').morph('50%').at(0.5).unit).toBe('%')
|
||||
})
|
||||
it('use the unit of this number as the unit of the returned number when the destination number as no unit', function() {
|
||||
expect(expect(new SVG.Number('100s').morph(50).at(0.5).unit).toBe('s'))
|
||||
})
|
||||
it('returns itself when no destination specified', function() {
|
||||
expect(number.at(0.5)).toBe(number)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+252
@@ -0,0 +1,252 @@
|
||||
describe('Path', function() {
|
||||
var path
|
||||
|
||||
beforeEach(function() {
|
||||
path = draw.path(svgPath)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('()', function() {
|
||||
it('falls back to a single point without an argument', function() {
|
||||
path = draw.path()
|
||||
expect(path.attr('d')).toBe('M0 0 ')
|
||||
})
|
||||
})
|
||||
|
||||
describe('array()', function() {
|
||||
it('returns an instance of SVG.PathArray', function() {
|
||||
expect(path.array() instanceof SVG.PathArray).toBeTruthy()
|
||||
})
|
||||
it('returns the value stored in the private variable _array', function() {
|
||||
expect(path.array()).toBe(path._array)
|
||||
})
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(path.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
path.x(123)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(path.y()).toBe(0)
|
||||
})
|
||||
it('sets the value of y with the first argument', function() {
|
||||
path.y(345)
|
||||
var box = path.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(path.cx()).toBe(50)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
path.cx(123)
|
||||
var box = path.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(path.cy()).toBe(50)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
path.cy(345)
|
||||
var box = path.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
path.move(123,456)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
it('sets the x and y position when scaled to half its size', function() {
|
||||
path.scale(0.5, 0, 0).move(123,456)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
path.move(50,60)
|
||||
path.dx(100)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(150)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
path.move(50, 60)
|
||||
path.dy(120)
|
||||
var box = path.bbox()
|
||||
expect(box.y).toBe(180)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
path.move(50,60)
|
||||
path.dmove(80, 25)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(130)
|
||||
expect(box.y).toBe(85)
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
path.center(321,567)
|
||||
var box = path.bbox()
|
||||
expect(box.x).toBe(271)
|
||||
expect(box.y).toBe(517)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width of the element', function() {
|
||||
path.width(234)
|
||||
var box = path.bbox()
|
||||
expect(box.width).toBeCloseTo(234)
|
||||
})
|
||||
it('gets the width of the element without an argument', function() {
|
||||
path.width(456)
|
||||
expect(path.width()).toBeCloseTo(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height of the element', function() {
|
||||
path.height(654)
|
||||
var box = path.bbox()
|
||||
expect(box.height).toBeCloseTo(654)
|
||||
})
|
||||
it('gets the height of the element without an argument', function() {
|
||||
path.height(321)
|
||||
expect(path.height()).toBeCloseTo(321)
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('defines the width and height of the element', function() {
|
||||
path.size(987,654)
|
||||
var box = path.bbox()
|
||||
expect(box.width).toBeCloseTo(987)
|
||||
expect(box.height).toBeCloseTo(654)
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = path.bbox()
|
||||
path.size(500)
|
||||
expect(path.width()).toBeCloseTo(500)
|
||||
expect(path.width() / path.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = path.bbox()
|
||||
path.size(null, 525)
|
||||
expect(path.height()).toBe(525)
|
||||
expect(path.width() / path.height()).toBeCloseTo(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box1 = path.rbox()
|
||||
, box2 = path.scale(2).rbox()
|
||||
|
||||
expect(box1.width * 2).toBe(box2.width)
|
||||
expect(box1.height * 2).toBe(box2.height)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box1 = path.rbox()
|
||||
, box2 = path.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box1.width * 2).toBe(box2.width)
|
||||
expect(box1.height * 3.5).toBe(box2.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
path.transform({ x: 12, y: 12 })
|
||||
expect(path.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plot()', function() {
|
||||
it('changes the d attribute of the underlying path node when a string is passed', function() {
|
||||
var pathString = 'm 3,2 c 0,0 -0,13 8,14 L 5,4'
|
||||
, pathArray = new SVG.PathArray(pathString)
|
||||
|
||||
expect(path.plot(pathString)).toBe(path)
|
||||
expect(path.attr('d')).toBe(pathString)
|
||||
})
|
||||
it('clears the array cache when a value is passed', function() {
|
||||
path = draw.path([ ['M', 50, 60], ['A', 60, 60, 0, 0, 0, 50, -60], ['z'] ])
|
||||
expect(path._array instanceof SVG.PathArray).toBeTruthy()
|
||||
path.plot('m 3,2 c 0,0 -0,13 8,14 L 5,4')
|
||||
expect(path._array).toBeUndefined()
|
||||
})
|
||||
it('applies a given path string value as is', function() {
|
||||
var pathString = 'm 3,2 c 0,0 -0,13 8,14 L 5,4'
|
||||
|
||||
path = draw.path(pathString)
|
||||
expect(path.attr('d')).toBe(pathString)
|
||||
})
|
||||
it('does not parse and cache a given string value to SVG.PathArray', function() {
|
||||
path = draw.path('m 3,2 c 0,0 -0,13 8,14 L 5,4')
|
||||
expect(path._array).toBeUndefined()
|
||||
})
|
||||
it('caches a given array value', function() {
|
||||
path = draw.path([ ['M', 50, 60], ['A', 60, 60, 0, 0, 0, 50, -60], ['H', 100], ['L', 20, 30], ['Z'] ])
|
||||
expect(path._array instanceof SVG.PathArray).toBeTruthy()
|
||||
})
|
||||
it('returns the path array when no arguments are passed', function () {
|
||||
expect(path.plot()).toBe(path.array())
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('clears the cached SVG.PathArray instance', function() {
|
||||
path = draw.path(svgPath)
|
||||
path.clear()
|
||||
expect(path._array).toBeUndefined()
|
||||
})
|
||||
})
|
||||
|
||||
describe('toString()', function() {
|
||||
it('renders path array correctly to string', function() {
|
||||
path = path.plot(['M', 50, 60, 'A', 60, 60, 0, 0, 0, 50, -60, 'H', 100, 'V', 100, 'L', 20, 30, 'C', 10, 20, 30, 40, 50, 60 ])
|
||||
expect(path.node.getAttribute('d')).toBe('M50 60A60 60 0 0 0 50 -60H100V100L20 30C10 20 30 40 50 60 ')
|
||||
})
|
||||
})
|
||||
|
||||
describe('length()', function() {
|
||||
it('gets the total length of the path', function() {
|
||||
expect(path.length()).toBe(path.node.getTotalLength())
|
||||
})
|
||||
})
|
||||
|
||||
describe('pointAt()', function() {
|
||||
it('gets a point at given length', function() {
|
||||
expect(path.pointAt(100)).toEqual(path.node.getPointAtLength(100))
|
||||
})
|
||||
})
|
||||
})
|
||||
+69
@@ -0,0 +1,69 @@
|
||||
describe('Pattern', function() {
|
||||
var rect, pattern
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
pattern = draw.pattern(20, 30, function(add) {
|
||||
add.rect(10,10).move(10,10)
|
||||
add.circle(30)
|
||||
})
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
pattern.remove()
|
||||
})
|
||||
|
||||
it('is an instance of SVG.Pattern', function() {
|
||||
expect(pattern instanceof SVG.Pattern).toBe(true)
|
||||
})
|
||||
|
||||
it('allows creation of a new gradient without block', function() {
|
||||
pattern = draw.pattern(10,30)
|
||||
expect(pattern.children().length).toBe(0)
|
||||
})
|
||||
|
||||
describe('fill()', function() {
|
||||
it('returns the id of the pattern wrapped in url()', function() {
|
||||
expect(pattern.fill()).toBe('url(#' + pattern.attr('id') + ')')
|
||||
})
|
||||
})
|
||||
|
||||
describe('attr()', function() {
|
||||
it('will catch transform attribues and convert them to patternTransform', function() {
|
||||
expect(pattern.translate(100,100).attr('patternTransform')).toBe('matrix(1,0,0,1,100,100)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('toString()', function() {
|
||||
it('returns the id of the pattern wrapped in url()', function() {
|
||||
expect(pattern + '').toBe('url(#' + pattern.attr('id') + ')')
|
||||
})
|
||||
it('is called when instance is passed as an attribute value', function() {
|
||||
rect.attr('fill', pattern)
|
||||
expect(rect.attr('fill')).toBe('url(#' + pattern.attr('id') + ')')
|
||||
})
|
||||
it('is called when instance is passed in a fill() method', function() {
|
||||
rect.fill(pattern)
|
||||
expect(rect.attr('fill')).toBe('url(#' + pattern.attr('id') + ')')
|
||||
})
|
||||
})
|
||||
|
||||
describe('update()', function() {
|
||||
|
||||
it('removes all existing children first', function() {
|
||||
pattern = draw.pattern(30, 30, function(add) {
|
||||
add.rect(10,10).move(10,10)
|
||||
add.circle(30)
|
||||
})
|
||||
expect(pattern.children().length).toBe(2)
|
||||
pattern.update(function(add) {
|
||||
add.rect(10,10).move(10,10)
|
||||
add.circle(30)
|
||||
})
|
||||
expect(pattern.children().length).toBe(2)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+140
@@ -0,0 +1,140 @@
|
||||
describe('Point', function() {
|
||||
var point
|
||||
|
||||
describe('initialization', function() {
|
||||
|
||||
describe('without a source', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
point = new SVG.Point
|
||||
})
|
||||
|
||||
it('creates a new point with default values', function() {
|
||||
expect(point.x).toBe(0)
|
||||
expect(point.y).toBe(0)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('with x and y given', function() {
|
||||
it('creates a point with given values', function() {
|
||||
var point = new SVG.Point(2,4)
|
||||
|
||||
expect(point.x).toBe(2)
|
||||
expect(point.y).toBe(4)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with only x given', function() {
|
||||
it('creates a point using the given value for both x and y', function() {
|
||||
var point = new SVG.Point(7)
|
||||
|
||||
expect(point.x).toBe(7)
|
||||
expect(point.y).toBe(7)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with array given', function() {
|
||||
it('creates a point from array', function() {
|
||||
var point = new SVG.Point([2,4])
|
||||
|
||||
expect(point.x).toBe(2)
|
||||
expect(point.y).toBe(4)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with object given', function() {
|
||||
it('creates a point from object', function() {
|
||||
var point = new SVG.Point({x:2,y:4})
|
||||
|
||||
expect(point.x).toBe(2)
|
||||
expect(point.y).toBe(4)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with SVG.Point given', function() {
|
||||
it('creates a point from SVG.Point', function() {
|
||||
var point = new SVG.Point(new SVG.Point(2,4))
|
||||
|
||||
expect(point.x).toBe(2)
|
||||
expect(point.y).toBe(4)
|
||||
})
|
||||
})
|
||||
|
||||
describe('with native SVGPoint given', function() {
|
||||
it('creates a point from native SVGPoint', function() {
|
||||
var point = new SVG.Point(new SVG.Point(2,4).native())
|
||||
|
||||
expect(point.x).toBe(2)
|
||||
expect(point.y).toBe(4)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('clone()', function() {
|
||||
it('returns cloned point', function() {
|
||||
var point1 = new SVG.Point(1,1)
|
||||
, point2 = point1.clone()
|
||||
|
||||
expect(point1).toEqual(point2)
|
||||
expect(point1).not.toBe(point2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('stores a given point for morphing', function() {
|
||||
var point1 = new SVG.Point(1,1)
|
||||
, point2 = new SVG.Point(2,2)
|
||||
|
||||
point1.morph(point2)
|
||||
|
||||
expect(point1.destination).toEqual(point2)
|
||||
})
|
||||
it('stores a clone, not the given matrix itself', function() {
|
||||
var point1 = new SVG.Point(1,1)
|
||||
, point2 = new SVG.Point(2,2)
|
||||
|
||||
point1.morph(point2)
|
||||
|
||||
expect(point1.destination).not.toBe(point2)
|
||||
})
|
||||
it('allow passing the point by directly passing its coordinates', function() {
|
||||
var point1 = new SVG.Point(1,1)
|
||||
, point2 = new SVG.Point(2,2)
|
||||
|
||||
point1.morph(point2.x, point2.y)
|
||||
|
||||
expect(point1.destination).toEqual(point2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('returns a morphed point at a given position', function() {
|
||||
var point1 = new SVG.Point(1,1)
|
||||
, point2 = new SVG.Point(2,2)
|
||||
, point3 = point1.morph(point2).at(0.5)
|
||||
|
||||
expect(point3).toEqual(new SVG.Point(1.5, 1.5))
|
||||
})
|
||||
it('returns itself when no destination specified', function() {
|
||||
var point = new SVG.Point(1,1)
|
||||
expect(point.at(0.4)).toBe(point)
|
||||
})
|
||||
})
|
||||
|
||||
describe('transform()', function() {
|
||||
it('returns a point transformed with given matrix', function() {
|
||||
var point = new SVG.Point(1,5)
|
||||
, matrix = new SVG.Matrix(0,0,1,0,0,1)
|
||||
|
||||
expect(point.transform(matrix)).toEqual(new SVG.Point(5,1))
|
||||
})
|
||||
})
|
||||
|
||||
describe('native()', function() {
|
||||
it('returns native SVGPoint', function() {
|
||||
expect(new SVG.Point().native() instanceof window.SVGPoint).toBeTruthy()
|
||||
})
|
||||
})
|
||||
})
|
||||
+228
@@ -0,0 +1,228 @@
|
||||
describe('Polygon', function() {
|
||||
var polygon
|
||||
|
||||
beforeEach(function() {
|
||||
polygon = draw.polygon('0,0 100,0 100,100 0,100')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('()', function(){
|
||||
it('falls back to a single point without an argument', function() {
|
||||
polygon = draw.polygon()
|
||||
expect(polygon.attr('points')).toBe('0,0')
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('array()', function() {
|
||||
it('returns an instance of SVG.PointArray', function() {
|
||||
expect(polygon.array() instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
it('returns the value stored in the private variable _array', function() {
|
||||
expect(polygon.array()).toBe(polygon._array)
|
||||
})
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(polygon.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
polygon.x(123)
|
||||
var box = polygon.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(polygon.y()).toBe(0)
|
||||
})
|
||||
it('sets the value of y with the first argument', function() {
|
||||
polygon.y(345)
|
||||
var box = polygon.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(polygon.cx()).toBe(50)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
polygon.cx(123)
|
||||
var box = polygon.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(polygon.cy()).toBe(50)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
polygon.cy(345)
|
||||
var box = polygon.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
polygon.move(123,456)
|
||||
var box = polygon.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
polygon.move(50,60)
|
||||
polygon.dx(100)
|
||||
var box = polygon.bbox()
|
||||
expect(box.x).toBe(150)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
polygon.move(50, 60)
|
||||
polygon.dy(120)
|
||||
var box = polygon.bbox()
|
||||
expect(box.y).toBe(180)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
polygon.move(50,60)
|
||||
polygon.dmove(80, 25)
|
||||
var box = polygon.bbox()
|
||||
expect(box.x).toBe(130)
|
||||
expect(box.y).toBe(85)
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
polygon.center(321,567)
|
||||
var box = polygon.bbox()
|
||||
expect(box.x).toBe(271)
|
||||
expect(box.y).toBe(517)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width and height of the element', function() {
|
||||
polygon.width(987)
|
||||
var box = polygon.bbox()
|
||||
expect(box.width).toBeCloseTo(987)
|
||||
})
|
||||
it('gets the width and height of the element without an argument', function() {
|
||||
polygon.width(789)
|
||||
expect(polygon.width()).toBeCloseTo(789)
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height and height of the element', function() {
|
||||
polygon.height(987)
|
||||
var box = polygon.bbox()
|
||||
expect(box.height).toBeCloseTo(987)
|
||||
})
|
||||
it('gets the height and height of the element without an argument', function() {
|
||||
polygon.height(789)
|
||||
expect(polygon.height()).toBeCloseTo(789)
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
polygon.size(987,654)
|
||||
var box = polygon.bbox()
|
||||
expect(box.width).toBeCloseTo(987)
|
||||
expect(box.height).toBeCloseTo(654)
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = polygon.bbox()
|
||||
polygon.size(500)
|
||||
expect(polygon.width()).toBe(500)
|
||||
expect(polygon.width() / polygon.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = polygon.bbox()
|
||||
polygon.size(null, 525)
|
||||
expect(polygon.height()).toBe(525)
|
||||
expect(polygon.width() / polygon.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box1 = polygon.rbox()
|
||||
, box2 = polygon.scale(2).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box1 = polygon.rbox()
|
||||
, box2 = polygon.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
polygon.transform({ x: 12, y: 12 })
|
||||
expect(polygon.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plot()', function() {
|
||||
it('changes the points attribute of the underlying polygon node when a string is passed', function() {
|
||||
var pointString = '100,50 75,20 200,100'
|
||||
, pointArray = new SVG.PointArray(pointString)
|
||||
|
||||
expect(polygon.plot(pointString)).toBe(polygon)
|
||||
expect(polygon.attr('points')).toBe(pointArray.toString())
|
||||
})
|
||||
it('returns the point array when no arguments are passed', function () {
|
||||
expect(polygon.plot()).toBe(polygon.array())
|
||||
})
|
||||
it('clears the array cache when a value is passed', function() {
|
||||
polygon = draw.polygon([100,50,75,20,200,100])
|
||||
expect(polygon._array instanceof SVG.PointArray).toBeTruthy()
|
||||
polygon.plot('100,50 75,20 200,100')
|
||||
expect(polygon._array).toBeUndefined()
|
||||
})
|
||||
it('applies a given polygon string value as is', function() {
|
||||
var polyString = '100,50,75,20,200,100'
|
||||
|
||||
polygon = draw.polygon(polyString)
|
||||
expect(polygon.attr('points')).toBe(polyString)
|
||||
})
|
||||
it('does not parse and cache a given string value to SVG.PointArray', function() {
|
||||
polygon = draw.polygon('100,50 75,20 200,100')
|
||||
expect(polygon._array).toBeUndefined()
|
||||
})
|
||||
it('caches a given array value', function() {
|
||||
polygon = draw.polygon([100,50,75,20,200,100])
|
||||
expect(polygon._array instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('clears the cached SVG.PointArray instance', function() {
|
||||
polygon = draw.polygon([100,50,75,20,200,100])
|
||||
polygon.clear()
|
||||
expect(polygon._array).toBeUndefined()
|
||||
})
|
||||
})
|
||||
})
|
||||
+228
@@ -0,0 +1,228 @@
|
||||
describe('Polyline', function() {
|
||||
var polyline
|
||||
|
||||
beforeEach(function() {
|
||||
polyline = draw.polyline('0,0 100,0 100,100 0,100')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('()', function(){
|
||||
it('falls back to a single point without an argument', function() {
|
||||
polyline = draw.polyline()
|
||||
expect(polyline.attr('points')).toBe('0,0')
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('array()', function() {
|
||||
it('returns an instance of SVG.PointArray', function() {
|
||||
expect(polyline.array() instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
it('returns the value stored in the private variable _array', function() {
|
||||
expect(polyline.array()).toBe(polyline._array)
|
||||
})
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(polyline.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
polyline.x(123)
|
||||
var box = polyline.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(polyline.y()).toBe(0)
|
||||
})
|
||||
it('sets the value of y with the first argument', function() {
|
||||
polyline.y(345)
|
||||
var box = polyline.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
expect(polyline.cx()).toBe(50)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
polyline.cx(123)
|
||||
var box = polyline.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
expect(polyline.cy()).toBe(50)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
polyline.cy(345)
|
||||
var box = polyline.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
polyline.move(123,456)
|
||||
var box = polyline.bbox()
|
||||
expect(box.x).toBe(123)
|
||||
expect(box.y).toBe(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
polyline.move(50,60)
|
||||
polyline.dx(100)
|
||||
var box = polyline.bbox()
|
||||
expect(box.x).toBe(150)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
polyline.move(50, 60)
|
||||
polyline.dy(120)
|
||||
var box = polyline.bbox()
|
||||
expect(box.y).toBe(180)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
polyline.move(50,60)
|
||||
polyline.dmove(80, 25)
|
||||
var box = polyline.bbox()
|
||||
expect(box.x).toBe(130)
|
||||
expect(box.y).toBe(85)
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
polyline.center(321,567)
|
||||
var box = polyline.bbox()
|
||||
expect(box.x).toBe(271)
|
||||
expect(box.y).toBe(517)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width and height of the element', function() {
|
||||
polyline.width(987)
|
||||
var box = polyline.bbox()
|
||||
expect(box.width).toBeCloseTo(987, 1)
|
||||
})
|
||||
it('gets the width and height of the element without an argument', function() {
|
||||
polyline.width(789)
|
||||
expect(polyline.width()).toBeCloseTo(789)
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height and height of the element', function() {
|
||||
polyline.height(987)
|
||||
var box = polyline.bbox()
|
||||
expect(box.height).toBeCloseTo(987)
|
||||
})
|
||||
it('gets the height and height of the element without an argument', function() {
|
||||
polyline.height(789)
|
||||
expect(polyline.height()).toBeCloseTo(789)
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
polyline.size(987,654)
|
||||
var box = polyline.bbox()
|
||||
expect(box.width).toBeCloseTo(987)
|
||||
expect(box.height).toBeCloseTo(654)
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = polyline.bbox()
|
||||
polyline.size(500)
|
||||
expect(polyline.width()).toBe(500)
|
||||
expect(polyline.width() / polyline.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = polyline.bbox()
|
||||
polyline.size(null, 525)
|
||||
expect(polyline.height()).toBe(525)
|
||||
expect(polyline.width() / polyline.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box1 = polyline.rbox()
|
||||
, box2 = polyline.scale(2).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box1 = polyline.rbox()
|
||||
, box2 = polyline.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box2.width).toBe(box1.width * 2)
|
||||
expect(box2.height).toBe(box1.height * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
polyline.transform({ x: 12, y: 12 })
|
||||
expect(polyline.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plot()', function() {
|
||||
it('change the points attribute of the underlying polyline node when a string is passed', function() {
|
||||
var pointString = '100,50 75,20 200,100'
|
||||
, pointArray = new SVG.PointArray(pointString)
|
||||
|
||||
expect(polyline.plot(pointString)).toBe(polyline)
|
||||
expect(polyline.attr('points')).toBe(pointArray.toString())
|
||||
})
|
||||
it('return the point array when no arguments are passed', function () {
|
||||
expect(polyline.plot()).toBe(polyline.array())
|
||||
})
|
||||
it('clears the array cache when a value is passed', function() {
|
||||
polyline = draw.polyline([100,50,75,20,200,100])
|
||||
expect(polyline._array instanceof SVG.PointArray).toBeTruthy()
|
||||
polyline.plot('100,50 75,20 200,100')
|
||||
expect(polyline._array).toBeUndefined()
|
||||
})
|
||||
it('applies a given polyline string value as is', function() {
|
||||
var polyString = '100,50,75,20,200,100'
|
||||
|
||||
polyline = draw.polyline(polyString)
|
||||
expect(polyline.attr('points')).toBe(polyString)
|
||||
})
|
||||
it('does not parse and cache a given string value to SVG.PointArray', function() {
|
||||
polyline = draw.polyline('100,50 75,20 200,100')
|
||||
expect(polyline._array).toBeUndefined()
|
||||
})
|
||||
it('caches a given array value', function() {
|
||||
polyline = draw.polyline([100,50,75,20,200,100])
|
||||
expect(polyline._array instanceof SVG.PointArray).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('clears the cached SVG.PointArray instance', function() {
|
||||
polyline = draw.polyline([100,50,75,20,200,100])
|
||||
polyline.clear()
|
||||
expect(polyline._array).toBeUndefined()
|
||||
})
|
||||
})
|
||||
})
|
||||
+179
@@ -0,0 +1,179 @@
|
||||
describe('Rect', function() {
|
||||
var rect
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(220,100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('should return the value of x without an argument', function() {
|
||||
expect(rect.x()).toBe(0)
|
||||
})
|
||||
it('should set the value of x with the first argument', function() {
|
||||
rect.x(123)
|
||||
expect(rect.node.getAttribute('x')).toBe('123')
|
||||
})
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('should return the value of y without an argument', function() {
|
||||
expect(rect.y()).toBe(0)
|
||||
})
|
||||
it('should set the value of y with the first argument', function() {
|
||||
rect.y(345)
|
||||
expect(rect.node.getAttribute('y')).toBe('345')
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('should return the value of cx without an argument', function() {
|
||||
expect(rect.cx()).toBe(110)
|
||||
})
|
||||
it('should set the value of cx with the first argument', function() {
|
||||
rect.cx(123)
|
||||
var box = rect.bbox()
|
||||
expect(box.cx).toBe(123)
|
||||
})
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('should return the value of cy without an argument', function() {
|
||||
expect(rect.cy()).toBe(50)
|
||||
})
|
||||
it('should set the value of cy with the first argument', function() {
|
||||
rect.cy(345)
|
||||
var box = rect.bbox()
|
||||
expect(box.cy).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('radius()', function() {
|
||||
it('should set the rx and ry', function() {
|
||||
rect.radius(10,20)
|
||||
expect(rect.node.getAttribute('rx')).toBe('10')
|
||||
expect(rect.node.getAttribute('ry')).toBe('20')
|
||||
})
|
||||
it('should set the rx and ry if only rx given', function() {
|
||||
rect.radius(30)
|
||||
expect(rect.node.getAttribute('rx')).toBe('30')
|
||||
expect(rect.node.getAttribute('ry')).toBe('30')
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('should set the x and y position', function() {
|
||||
rect.move(123,456)
|
||||
expect(rect.node.getAttribute('x')).toBe('123')
|
||||
expect(rect.node.getAttribute('y')).toBe('456')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('moves the x positon of the element relative to the current position', function() {
|
||||
rect.move(50,60)
|
||||
rect.dx(100)
|
||||
expect(rect.node.getAttribute('x')).toBe('150')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dy()', function() {
|
||||
it('moves the y positon of the element relative to the current position', function() {
|
||||
rect.move(50,60)
|
||||
rect.dy(120)
|
||||
expect(rect.node.getAttribute('y')).toBe('180')
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
it('moves the x and y positon of the element relative to the current position', function() {
|
||||
rect.move(50,60)
|
||||
rect.dmove(80, 25)
|
||||
expect(rect.node.getAttribute('x')).toBe('130')
|
||||
expect(rect.node.getAttribute('y')).toBe('85')
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('should set the cx and cy position', function() {
|
||||
rect.center(321,567)
|
||||
var box = rect.bbox()
|
||||
expect(box.cx).toBe(321)
|
||||
expect(box.cy).toBe(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('width()', function() {
|
||||
it('sets the width of the element', function() {
|
||||
rect.width(789)
|
||||
expect(rect.node.getAttribute('width')).toBe('789')
|
||||
})
|
||||
it('gets the width of the element if the argument is null', function() {
|
||||
expect(rect.width().toString()).toBe(rect.node.getAttribute('width'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('height()', function() {
|
||||
it('sets the height of the element', function() {
|
||||
rect.height(1236)
|
||||
expect(rect.node.getAttribute('height')).toBe('1236')
|
||||
})
|
||||
it('gets the height of the element if the argument is null', function() {
|
||||
expect(rect.height().toString()).toBe(rect.node.getAttribute('height'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
rect.size(987,654)
|
||||
expect(rect.node.getAttribute('width')).toBe('987')
|
||||
expect(rect.node.getAttribute('height')).toBe('654')
|
||||
})
|
||||
it('defines the width and height proportionally with only the width value given', function() {
|
||||
var box = rect.bbox()
|
||||
rect.size(500)
|
||||
expect(rect.width()).toBe(500)
|
||||
expect(rect.width() / rect.height()).toBe(box.width / box.height)
|
||||
})
|
||||
it('defines the width and height proportionally with only the height value given', function() {
|
||||
var box = rect.bbox()
|
||||
rect.size(null, 525)
|
||||
expect(rect.height()).toBe(525)
|
||||
expect(rect.width() / rect.height()).toBe(box.width / box.height)
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
it('should scale the element universally with one argument', function() {
|
||||
var box = rect.scale(2).rbox()
|
||||
|
||||
expect(box.width).toBe(rect.attr('width') * 2)
|
||||
expect(box.height).toBe(rect.attr('height') * 2)
|
||||
})
|
||||
it('should scale the element over individual x and y axes with two arguments', function() {
|
||||
var box = rect.scale(2, 3.5).rbox()
|
||||
|
||||
expect(box.width).toBe(rect.attr('width') * 2)
|
||||
expect(box.height).toBe(rect.attr('height') * 3.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('should set the translation of an element', function() {
|
||||
rect.transform({ x: 12, y: 12 })
|
||||
expect(rect.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
+92
@@ -0,0 +1,92 @@
|
||||
describe('Regex', function() {
|
||||
|
||||
describe('matchers', function() {
|
||||
|
||||
describe('numberAndUnit', function() {
|
||||
var match
|
||||
|
||||
it('is true with a positive unit value', function() {
|
||||
match = ('10%').match(SVG.regex.numberAndUnit)
|
||||
expect(match[1]).toBe('10')
|
||||
expect(match[5]).toBe('%')
|
||||
})
|
||||
it('is true with a negative unit value', function() {
|
||||
match = ('-11%').match(SVG.regex.numberAndUnit)
|
||||
expect(match[1]).toBe('-11')
|
||||
expect(match[5]).toBe('%')
|
||||
})
|
||||
it('is false with a positive unit value', function() {
|
||||
match = ('NotAUnit').match(SVG.regex.numberAndUnit)
|
||||
expect(match).toBeNull()
|
||||
})
|
||||
|
||||
it('is true with a number', function() {
|
||||
["1", "-1", "+15", "1.55", ".5", "5.", "1.3e2", "1E-4", "1e+12"].forEach(function(s) {
|
||||
expect(SVG.regex.numberAndUnit.test(s)).toBeTruthy()
|
||||
})
|
||||
})
|
||||
it('is false with a faulty number', function() {
|
||||
["+-1", "1.2.3", "1+1", "1e4.5", ".5.", "1f5", "."].forEach(function(s) {
|
||||
expect(SVG.regex.numberAndUnit.test(s)).toBeFalsy()
|
||||
})
|
||||
})
|
||||
it('is true with a number with unit', function() {
|
||||
["1px", "-1em", "+15%", "1.55s", ".5pt", "5.deg", "1.3e2rad", "1E-4grad", "1e+12cm"].forEach(function(s) {
|
||||
expect(SVG.regex.numberAndUnit.test(s)).toBeTruthy()
|
||||
})
|
||||
})
|
||||
it('is false with a faulty number or wrong unit', function() {
|
||||
["1em1", "-1eq,5"].forEach(function(s) {
|
||||
expect(SVG.regex.numberAndUnit.test(s)).toBeFalsy()
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
})
|
||||
|
||||
describe('testers', function() {
|
||||
|
||||
describe('isHex', function() {
|
||||
it('is true with a three based hex', function() {
|
||||
expect(SVG.regex.isHex.test('#f09')).toBeTruthy()
|
||||
})
|
||||
it('is true with a six based hex', function() {
|
||||
expect(SVG.regex.isHex.test('#fe0198')).toBeTruthy()
|
||||
})
|
||||
it('is false with a faulty hex', function() {
|
||||
expect(SVG.regex.isHex.test('###')).toBeFalsy()
|
||||
expect(SVG.regex.isHex.test('#0')).toBeFalsy()
|
||||
expect(SVG.regex.isHex.test('f06')).toBeFalsy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('isRgb', function() {
|
||||
it('is true with an rgb value', function() {
|
||||
expect(SVG.regex.isRgb.test('rgb(255,66,100)')).toBeTruthy()
|
||||
})
|
||||
it('is false with a non-rgb value', function() {
|
||||
expect(SVG.regex.isRgb.test('hsb(255, 100, 100)')).toBeFalsy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('isNumber', function() {
|
||||
|
||||
it('is true with a number', function() {
|
||||
["1", "-1", "+15", "1.55", ".5", "5.", "1.3e2", "1E-4", "1e+12"].forEach(function(s) {
|
||||
expect(SVG.regex.isNumber.test(s)).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
it('is false with a faulty number', function() {
|
||||
["1a", "+-1", "1.2.3", "1+1", "1e4.5", ".5.", "1f5", "."].forEach(function(s) {
|
||||
expect(SVG.regex.isNumber.test(s)).toBeFalsy()
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
describe('Selector', function() {
|
||||
|
||||
describe('get()', function() {
|
||||
it('gets an element\'s instance by id', function() {
|
||||
var rect = draw.rect(111, 333)
|
||||
|
||||
expect(SVG.get(rect.attr('id'))).toBe(rect)
|
||||
})
|
||||
it('makes all the element\'s methods available', function() {
|
||||
var element = draw.group()
|
||||
, got = SVG.get(element.attr('id'))
|
||||
|
||||
expect(got.attr()).toEqual(element.attr())
|
||||
})
|
||||
it('gets a referenced element by attribute value', function() {
|
||||
var rect = draw.defs().rect(100, 100)
|
||||
, use = draw.use(rect)
|
||||
, mark = draw.marker(10, 10)
|
||||
, path = draw.path(svgPath).marker('end', mark)
|
||||
|
||||
expect(SVG.get(use.attr('href'))).toBe(rect)
|
||||
expect(SVG.get(path.attr('marker-end'))).toBe(mark)
|
||||
})
|
||||
})
|
||||
|
||||
describe('select()', function() {
|
||||
var e1, e2, e3, e4 ,e5
|
||||
|
||||
beforeEach(function() {
|
||||
e1 = draw.rect(100, 100).addClass('selectable-element')
|
||||
e2 = draw.rect(100, 100).addClass('unselectable-element')
|
||||
e3 = draw.rect(100, 100).addClass('selectable-element')
|
||||
e4 = draw.rect(100, 100).addClass('unselectable-element')
|
||||
e5 = draw.rect(100, 100).addClass('selectable-element')
|
||||
})
|
||||
it('gets all elements with a given class name', function() {
|
||||
expect(SVG.select('rect.selectable-element').valueOf()).toEqual([e1, e3, e5])
|
||||
})
|
||||
it('returns an instance of SVG.Set', function() {
|
||||
expect(SVG.select('rect.selectable-element') instanceof SVG.Set).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('Parent#select()', function() {
|
||||
it('gets all elements with a given class name inside a given element', function() {
|
||||
var group = draw.group()
|
||||
, e1 = draw.rect(100, 100).addClass('selectable-element')
|
||||
, e2 = draw.rect(100, 100).addClass('unselectable-element')
|
||||
, e3 = group.rect(100, 100).addClass('selectable-element')
|
||||
, e4 = draw.rect(100, 100).addClass('unselectable-element')
|
||||
, e5 = group.rect(100, 100).addClass('selectable-element')
|
||||
|
||||
expect(group.select('rect.selectable-element').valueOf()).toEqual([e3, e5])
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+214
@@ -0,0 +1,214 @@
|
||||
describe('Set', function() {
|
||||
var set, e1, e2, e3, e4, e5
|
||||
|
||||
beforeEach(function() {
|
||||
draw.attr('viewBox', null)
|
||||
set = draw.set()
|
||||
e1 = draw.rect(100,100).attr('id', 'e1').move(200,250)
|
||||
e2 = draw.ellipse(100,100).attr('id', 'e2')
|
||||
e3 = draw.line(0,0,100,100).attr('id', 'e3')
|
||||
e4 = draw.circle(50).attr('id', 'e4')
|
||||
e5 = draw.polyline('0,0 10,20 30,50 80,100').attr('id', 'e5')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
it('creates the set method on SVG.Container instances', function() {
|
||||
expect(draw.set() instanceof SVG.Set).toBeTruthy()
|
||||
})
|
||||
|
||||
it('creates a set with initial value', function() {
|
||||
var members = [1, 2, 4]
|
||||
|
||||
expect(draw.set(members).valueOf()).toBe(members)
|
||||
})
|
||||
|
||||
it('creates a set when passing another set', function() {
|
||||
var set = new SVG.Set([1, 2, 4])
|
||||
var set2 = new SVG.Set(set)
|
||||
|
||||
expect(set.valueOf()).not.toBe(set2.valueOf())
|
||||
expect(set.valueOf()).toEqual(set2.valueOf())
|
||||
})
|
||||
|
||||
describe('add()', function() {
|
||||
it('returns the set instance', function() {
|
||||
expect(set.add(e1)).toBe(set)
|
||||
})
|
||||
it('stores given element', function() {
|
||||
set.add(e1).add(e2).add(e3)
|
||||
expect(set.valueOf()).toEqual([e1,e2,e3])
|
||||
expect(set.members.length).toBe(3)
|
||||
})
|
||||
it('accepts multiple elements at once', function() {
|
||||
set.add(e1, e2, e3, e4, e5)
|
||||
expect(set.valueOf()).toEqual([e1, e2, e3, e4, e5])
|
||||
expect(set.members.length).toBe(5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('remove()', function() {
|
||||
it('returns the set instance', function() {
|
||||
set.add(e1)
|
||||
expect(set.remove(e1)).toBe(set)
|
||||
})
|
||||
it('removes given element', function() {
|
||||
set.add(e1).add(e2).add(e3).remove(e2)
|
||||
expect(set.valueOf()).toEqual([e1,e3])
|
||||
expect(set.members.length).toBe(2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('each()', function() {
|
||||
it('returns the set instance', function() {
|
||||
expect(set.each(function(){})).toBe(set)
|
||||
})
|
||||
it('iterates over all members of the set', function() {
|
||||
var ids = []
|
||||
set.add(e1).add(e2).add(e3)
|
||||
|
||||
set.each(function() {
|
||||
ids.push(this.attr('id'))
|
||||
})
|
||||
|
||||
expect(ids.length).toBe(3)
|
||||
expect(ids).toEqual(['e1','e2','e3'])
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('returns the set instance', function() {
|
||||
expect(set.clear()).toBe(set)
|
||||
})
|
||||
it('removes all members from set', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5).clear()
|
||||
expect(set.members.length).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('get()', function() {
|
||||
it('returns member at given index', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
expect(set.get(2)).toBe(e3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('first()', function() {
|
||||
it('returns first member', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
expect(set.first()).toBe(e1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('last()', function() {
|
||||
it('returns last member', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
expect(set.last()).toBe(e5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('has()', function() {
|
||||
it('checks if a given element is present in set', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
expect(set.has(e4)).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('length()', function() {
|
||||
it('gets the length of the set', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
expect(set.length()).toBe(5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('index()', function() {
|
||||
it('returns the index of a given element within the set', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e5)
|
||||
expect(set.index(e1)).toBe(0)
|
||||
expect(set.index(e2)).toBe(1)
|
||||
expect(set.index(e3)).toBe(2)
|
||||
expect(set.index(e4)).toBe(-1)
|
||||
expect(set.index(e5)).toBe(3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('valueOf()', function() {
|
||||
it('returns the members array', function() {
|
||||
set.add(e1)
|
||||
expect(set.valueOf()).toBe(set.members)
|
||||
})
|
||||
})
|
||||
|
||||
describe('bbox()', function() {
|
||||
it('returns the bounding box of all elements', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
|
||||
var box = set.bbox()
|
||||
|
||||
expect(box.x).toBeCloseTo(0)
|
||||
expect(box.y).toBeCloseTo(0, 0)
|
||||
expect(box.width).toBeCloseTo(300)
|
||||
expect(box.height).toBeCloseTo(350)
|
||||
})
|
||||
it('returns an instance of SVG.RBox', function() {
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5)
|
||||
|
||||
expect(set.bbox() instanceof SVG.RBox).toBeTruthy()
|
||||
})
|
||||
it('returns an empty bounding box wiht no members', function() {
|
||||
var box = set.bbox()
|
||||
|
||||
expect(box.x).toBe(0)
|
||||
expect(box.y).toBe(0)
|
||||
expect(box.width).toBe(0)
|
||||
expect(box.height).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('method alias', function() {
|
||||
|
||||
describe('attr()', function() {
|
||||
it('is applied to every member of the set', function() {
|
||||
var fills = []
|
||||
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5).attr('fill', '#ff0099')
|
||||
set.each(function() {
|
||||
fills.push(this.attr('fill'))
|
||||
})
|
||||
|
||||
expect(fills).toEqual(['#ff0099','#ff0099','#ff0099','#ff0099','#ff0099'])
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('method inheritance', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
SVG.extend(SVG.Element, {
|
||||
orange: function() {
|
||||
this.fill('#ff6600')
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
it('inherits newly added element methods after initialisation', function() {
|
||||
expect(typeof set.orange).toBe('function')
|
||||
})
|
||||
|
||||
it('applies newly inherited methods properly to members', function() {
|
||||
var fills = []
|
||||
|
||||
set.add(e1).add(e2).add(e3).add(e4).add(e5).orange()
|
||||
set.each(function() {
|
||||
fills.push(this.attr('fill'))
|
||||
})
|
||||
|
||||
expect(fills).toEqual(['#ff6600','#ff6600','#ff6600','#ff6600','#ff6600'])
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+358
@@ -0,0 +1,358 @@
|
||||
describe('Sugar', function() {
|
||||
|
||||
var rect
|
||||
|
||||
beforeEach(function() {
|
||||
draw.attr('viewBox', null)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('fill()', function() {
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
})
|
||||
|
||||
it('returns the node reference', function() {
|
||||
expect(rect.fill('red')).toBe(rect)
|
||||
})
|
||||
|
||||
it('sets the given value', function() {
|
||||
expect(rect.fill('red').attr('fill')).toBe('red')
|
||||
})
|
||||
|
||||
it('sets the given value with object given', function() {
|
||||
rect.fill({color: 'red', opacity: 0.5, rule: 'odd'})
|
||||
expect(rect.attr('fill')).toBe('red')
|
||||
expect(rect.attr('fill-opacity')).toBe(0.5)
|
||||
expect(rect.attr('fill-rule')).toBe('odd')
|
||||
})
|
||||
|
||||
it('is a nop with no argument given and returns node reference', function() {
|
||||
rect.fill('red')
|
||||
expect(rect.fill()).toBe(rect)
|
||||
expect(rect.attr('fill')).toBe('red')
|
||||
})
|
||||
})
|
||||
|
||||
describe('rotate()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'transform')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.transform.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to transform()', function() {
|
||||
rect.rotate(1,2,3)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ rotation: 1, cx: 2, cy: 3 })
|
||||
})
|
||||
})
|
||||
|
||||
describe('skew()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'transform')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.transform.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to transform() with no argument', function() {
|
||||
rect.skew()
|
||||
expect(rect.transform).toHaveBeenCalledWith({ skewX: undefined, skewY: undefined, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with one argument', function() {
|
||||
rect.skew(5)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ skew: 5, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with two argument', function() {
|
||||
rect.skew(5, 6)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ skewX: 5, skewY: 6, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with three arguments', function() {
|
||||
rect.skew(5, 6, 7)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ skew: 5, cx: 6, cy: 7 })
|
||||
})
|
||||
|
||||
it('redirects to transform() with four arguments', function() {
|
||||
rect.skew(5, 6, 7, 8)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ skewX: 5, skewY: 6, cx: 7, cy: 8 })
|
||||
})
|
||||
})
|
||||
|
||||
describe('scale()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'transform')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.transform.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to transform() with no argument', function() {
|
||||
rect.scale()
|
||||
expect(rect.transform).toHaveBeenCalledWith({ scaleX: undefined, scaleY: undefined, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with one argument', function() {
|
||||
rect.scale(5)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ scale: 5, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with two argument', function() {
|
||||
rect.scale(5, 6)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ scaleX: 5, scaleY: 6, cx: undefined, cy: undefined })
|
||||
})
|
||||
|
||||
it('redirects to transform() with three arguments', function() {
|
||||
rect.scale(5, 6, 7)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ scale: 5, cx: 6, cy: 7 })
|
||||
})
|
||||
|
||||
it('redirects to transform() with four arguments', function() {
|
||||
rect.scale(5, 6, 7, 8)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ scaleX: 5, scaleY: 6, cx: 7, cy: 8 })
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'transform')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.transform.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to transform()', function() {
|
||||
rect.translate(1,2)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ x: 1, y: 2 })
|
||||
})
|
||||
})
|
||||
|
||||
describe('flip()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'transform')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.transform.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to transform()', function() {
|
||||
rect.flip('x',2)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ flip: 'x', offset: 2 })
|
||||
})
|
||||
|
||||
it('sets flip to "both" when calling without anything', function() {
|
||||
rect.flip()
|
||||
expect(rect.transform).toHaveBeenCalledWith({ flip: 'both', offset: undefined })
|
||||
})
|
||||
|
||||
// this works because only x and y are valid flip values. Evereything else flips on both axis
|
||||
it('sets flip to number and offset to number when called with offset only', function() {
|
||||
rect.flip(5)
|
||||
expect(rect.transform).toHaveBeenCalledWith({ flip: 5, offset: 5 })
|
||||
})
|
||||
})
|
||||
|
||||
describe('matrix()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'attr')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.attr.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to attr() directly with one argument', function() {
|
||||
rect.matrix([1,2,3,4,5,6])
|
||||
expect(rect.attr).toHaveBeenCalledWith('transform', new SVG.Matrix([1,2,3,4,5,6]))
|
||||
})
|
||||
|
||||
it('redirects to attr() directly with 6 arguments', function() {
|
||||
rect.matrix(1,2,3,4,5,6)
|
||||
expect(rect.attr).toHaveBeenCalledWith('transform', new SVG.Matrix([1,2,3,4,5,6]))
|
||||
})
|
||||
})
|
||||
|
||||
describe('opacity()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'attr')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.attr.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to attr() directly', function() {
|
||||
rect.opacity(0.5)
|
||||
expect(rect.attr).toHaveBeenCalledWith('opacity', 0.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx() / dy()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'x').and.callThrough()
|
||||
spyOn(rect, 'y').and.callThrough()
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.x.calls.reset()
|
||||
rect.y.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to x() / y() with adding the current value', function() {
|
||||
rect.dx(5)
|
||||
rect.dy(5)
|
||||
expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5')), true)
|
||||
expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5')), true)
|
||||
})
|
||||
|
||||
it('allows to add a percentage value', function() {
|
||||
rect.move('5%', '5%')
|
||||
|
||||
rect.dx('5%')
|
||||
rect.dy('5%')
|
||||
|
||||
expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('10%')), true)
|
||||
expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('10%')), true)
|
||||
})
|
||||
|
||||
it('allows to add a percentage value when no x/y is set', function() {
|
||||
rect.dx('5%')
|
||||
rect.dy('5%')
|
||||
|
||||
expect(rect.x).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5%')), true)
|
||||
expect(rect.y).toHaveBeenCalledWith(jasmine.objectContaining(new SVG.Number('5%')), true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dmove()', function() {
|
||||
var rect, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
spyOn(rect, 'dx').and.callThrough()
|
||||
spyOn(rect, 'dy').and.callThrough()
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
rect.remove()
|
||||
rect.dx.calls.reset()
|
||||
rect.dy.calls.reset()
|
||||
})
|
||||
|
||||
it('redirects to dx() / dy() directly', function() {
|
||||
rect.dmove(5,5)
|
||||
expect(rect.dx).toHaveBeenCalledWith(5)
|
||||
expect(rect.dy).toHaveBeenCalledWith(5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('font()', function() {
|
||||
var text, spy, undefined
|
||||
|
||||
beforeEach(function() {
|
||||
text = draw.text(loremIpsum)
|
||||
spyOn(text, 'leading')
|
||||
spyOn(text, 'attr')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
text.remove()
|
||||
text.leading.calls.reset()
|
||||
text.attr.calls.reset()
|
||||
})
|
||||
|
||||
it('sets leading when given', function() {
|
||||
text.font({leading: 3})
|
||||
expect(text.leading).toHaveBeenCalledWith(3)
|
||||
})
|
||||
|
||||
it('sets text-anchor when anchor given', function() {
|
||||
text.font({anchor: 'start'})
|
||||
expect(text.attr).toHaveBeenCalledWith('text-anchor', 'start')
|
||||
})
|
||||
|
||||
it('sets all font properties via attr()', function() {
|
||||
text.font({
|
||||
size: 20,
|
||||
family: 'Verdana',
|
||||
weight: 'bold',
|
||||
stretch: 'wider',
|
||||
variant: 'small-caps',
|
||||
style: 'italic'
|
||||
})
|
||||
expect(text.attr).toHaveBeenCalledWith('font-size', 20)
|
||||
expect(text.attr).toHaveBeenCalledWith('font-family', 'Verdana')
|
||||
expect(text.attr).toHaveBeenCalledWith('font-weight', 'bold')
|
||||
expect(text.attr).toHaveBeenCalledWith('font-stretch', 'wider')
|
||||
expect(text.attr).toHaveBeenCalledWith('font-variant', 'small-caps')
|
||||
expect(text.attr).toHaveBeenCalledWith('font-style', 'italic')
|
||||
})
|
||||
|
||||
it('redirects all other stuff directly to attr()', function() {
|
||||
text.font({
|
||||
foo:'bar',
|
||||
bar:'baz'
|
||||
})
|
||||
expect(text.attr).toHaveBeenCalledWith('foo', 'bar')
|
||||
expect(text.attr).toHaveBeenCalledWith('bar', 'baz')
|
||||
})
|
||||
|
||||
it('sets key value pair when called with 2 parameters', function() {
|
||||
text.font('size', 20)
|
||||
expect(text.attr).toHaveBeenCalledWith('font-size', 20)
|
||||
})
|
||||
|
||||
it('gets value if called with one parameter', function() {
|
||||
text.font('size')
|
||||
expect(text.attr).toHaveBeenCalledWith('font-size', undefined)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+115
@@ -0,0 +1,115 @@
|
||||
describe('SVG', function() {
|
||||
|
||||
describe('()', function() {
|
||||
var drawing, wrapper
|
||||
|
||||
beforeEach(function() {
|
||||
wrapper = document.createElement('svg')
|
||||
document.documentElement.appendChild(wrapper)
|
||||
drawing = SVG(wrapper)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
wrapper.parentNode.removeChild(wrapper)
|
||||
})
|
||||
|
||||
it('creates a new svg drawing', function() {
|
||||
expect(drawing.type).toBe('svg')
|
||||
})
|
||||
it('creates an instance of SVG.Doc', function() {
|
||||
expect(drawing instanceof SVG.Doc).toBe(true)
|
||||
})
|
||||
|
||||
if(parserInDoc){
|
||||
it('sets no default size in svg documents', function() {
|
||||
expect(drawing.width()).toBe(0)
|
||||
expect(drawing.height()).toBe(0)
|
||||
})
|
||||
}else{
|
||||
it('sets size to 100% in html documents', function() {
|
||||
expect(drawing.width()).toBe('100%')
|
||||
expect(drawing.height()).toBe('100%')
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
describe('create()', function() {
|
||||
it('creates an element with given node name and return it', function() {
|
||||
var element = SVG.create('rect')
|
||||
|
||||
expect(element.nodeName).toBe('rect')
|
||||
})
|
||||
it('increases the global id sequence', function() {
|
||||
var did = SVG.did
|
||||
, element = SVG.create('rect')
|
||||
|
||||
expect(did + 1).toBe(SVG.did)
|
||||
})
|
||||
it('adds a unique id containing the node name', function() {
|
||||
var did = SVG.did
|
||||
, element = SVG.create('rect')
|
||||
|
||||
expect(element.getAttribute('id')).toBe('SvgjsRect' + did)
|
||||
})
|
||||
})
|
||||
|
||||
describe('extend()', function() {
|
||||
it('adds all functions in the given object to the target object', function() {
|
||||
SVG.extend(SVG.Rect, {
|
||||
soft: function() {
|
||||
return this.opacity(0.2)
|
||||
}
|
||||
})
|
||||
|
||||
expect(typeof SVG.Rect.prototype.soft).toBe('function')
|
||||
expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.2)
|
||||
})
|
||||
it('accepts and extend multiple modules at once', function() {
|
||||
SVG.extend(SVG.Rect, SVG.Ellipse, SVG.Path, {
|
||||
soft: function() {
|
||||
return this.opacity(0.5)
|
||||
}
|
||||
})
|
||||
|
||||
expect(typeof SVG.Rect.prototype.soft).toBe('function')
|
||||
expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.5)
|
||||
expect(typeof SVG.Ellipse.prototype.soft).toBe('function')
|
||||
expect(draw.ellipse(100,100).soft().attr('opacity')).toBe(0.5)
|
||||
expect(typeof SVG.Path.prototype.soft).toBe('function')
|
||||
expect(draw.path().soft().attr('opacity')).toBe(0.5)
|
||||
})
|
||||
it('ignores non existant objects', function() {
|
||||
SVG.extend(SVG.Rect, SVG.Bogus, {
|
||||
soft: function() {
|
||||
return this.opacity(0.3)
|
||||
}
|
||||
})
|
||||
|
||||
expect(typeof SVG.Rect.prototype.soft).toBe('function')
|
||||
expect(draw.rect(100,100).soft().attr('opacity')).toBe(0.3)
|
||||
expect(typeof SVG.Bogus).toBe('undefined')
|
||||
})
|
||||
})
|
||||
|
||||
describe('prepare()', function() {
|
||||
var drawing, wrapper, parser
|
||||
|
||||
beforeEach(function() {
|
||||
wrapper = document.createElement('svg')
|
||||
document.documentElement.appendChild(wrapper)
|
||||
drawing = SVG(wrapper)
|
||||
})
|
||||
|
||||
it('creates a parser element when calling SVG()', function() {
|
||||
expect(SVG.parser.draw.nodeName).toBe('svg')
|
||||
})
|
||||
it('hides the parser', function() {
|
||||
expect(window.stripped(SVG.parser.draw.getAttribute('style'))).toBe('overflow:hidden;top:-100%;left:-100%;position:absolute;opacity:0')
|
||||
})
|
||||
it('holds polyline and path', function() {
|
||||
expect(SVG.select('polyline', SVG.parser.draw).first().type).toBe('polyline')
|
||||
expect(SVG.select('path', SVG.parser.draw).first().type).toBe('path')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+16
@@ -0,0 +1,16 @@
|
||||
describe('Symbol', function() {
|
||||
describe('()', function() {
|
||||
var element
|
||||
|
||||
beforeEach(function() {
|
||||
element = draw.symbol()
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Symbol', function() {
|
||||
expect(element instanceof SVG.Symbol).toBeTruthy()
|
||||
})
|
||||
it('is an instance of SVG.Container', function() {
|
||||
expect(element instanceof SVG.Container).toBeTruthy()
|
||||
})
|
||||
})
|
||||
})
|
||||
+304
@@ -0,0 +1,304 @@
|
||||
// IMPORTANT!!!
|
||||
// The native getBBox() on text elements isn't always accurate in the decimals.
|
||||
// Therefore sometimes some rounding is used to make test work as expected.
|
||||
|
||||
describe('Text', function() {
|
||||
var text
|
||||
|
||||
beforeEach(function() {
|
||||
text = draw.text(loremIpsum).size(5)
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('leading()', function() {
|
||||
it('returns the leading value of the text without an argument', function() {
|
||||
expect(text.leading() instanceof SVG.Number)
|
||||
expect(text.leading().valueOf()).toBe(1.3)
|
||||
})
|
||||
it('sets the leading value of the text with the first argument', function() {
|
||||
expect(text.leading(1.5).dom.leading.valueOf()).toBe(1.5)
|
||||
})
|
||||
})
|
||||
|
||||
describe('rebuild()', function() {
|
||||
it('disables the rebuild if called with false', function() {
|
||||
expect(text.rebuild(false)._rebuild).toBeFalsy()
|
||||
})
|
||||
it('enables the rebuild if called with true', function() {
|
||||
expect(text.rebuild(true)._rebuild).toBeTruthy()
|
||||
})
|
||||
it('rebuilds the text without an argument given', function() {
|
||||
var dy = text.lines().get(2).attr('dy')
|
||||
text.leading(1.7)
|
||||
expect(dy == text.lines().get(2).attr('dy')).toBeFalsy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('x()', function() {
|
||||
it('returns the value of x without an argument', function() {
|
||||
expect(text.x()).toBe(0)
|
||||
})
|
||||
it('sets the value of x with the first argument', function() {
|
||||
text.x(123)
|
||||
expect(text.node.getAttribute('x')).toBeCloseTo(123)
|
||||
})
|
||||
it('sets the value of all lines', function() {
|
||||
text.x(200)
|
||||
text.lines().each(function() {
|
||||
expect(this.x()).toBe(200)
|
||||
})
|
||||
})
|
||||
it('sets the value of y with a percent value', function() {
|
||||
text.x('40%')
|
||||
expect(text.node.getAttribute('x')).toBe('40%')
|
||||
})
|
||||
it('returns the value of x when x is a percentual value', function() {
|
||||
expect(text.x('45%').x()).toBe('45%')
|
||||
})
|
||||
// Woow this test is old. The functionality not even implemented anymore
|
||||
// Was a good feature. Maybe we add it back?
|
||||
/*it('sets the value of x based on the anchor with the first argument', function() {
|
||||
text.x(123, true)
|
||||
var box = text.bbox()
|
||||
expect(box.x).toBeCloseTo(123)
|
||||
})*/
|
||||
})
|
||||
|
||||
describe('y()', function() {
|
||||
it('returns the value of y without an argument', function() {
|
||||
expect(text.y(0).y()).toBeCloseTo(0)
|
||||
})
|
||||
it('returns the value of y when y is a percentual value', function() {
|
||||
expect(text.y('45%').y()).toBe('45%')
|
||||
})
|
||||
it('sets the value of y with the first argument', function() {
|
||||
text.y(345)
|
||||
var box = text.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
it('sets the value of y with SVG.Number as first argument', function() {
|
||||
text.y(new SVG.Number(345))
|
||||
var box = text.bbox()
|
||||
expect(box.y).toBe(345)
|
||||
})
|
||||
it('sets the value of y with a percent value', function() {
|
||||
text.y('40%')
|
||||
expect(text.node.getAttribute('y')).toBe('40%')
|
||||
})
|
||||
})
|
||||
|
||||
describe('cx()', function() {
|
||||
it('returns the value of cx without an argument', function() {
|
||||
var box = text.bbox()
|
||||
expect(text.cx()).toBeCloseTo(box.x + box.width / 2)
|
||||
})
|
||||
it('sets the value of cx with the first argument', function() {
|
||||
text.cx(123)
|
||||
var box = text.bbox()
|
||||
// this is a hack. it should be exactly 123 since you set it. But bbox with text is a thing...
|
||||
expect(box.cx).toBeCloseTo(box.x + box.width/2)
|
||||
})
|
||||
// not implemented anymore
|
||||
/*it('sets the value of cx based on the anchor with the first argument', function() {
|
||||
text.cx(123, true)
|
||||
var box = text.bbox()
|
||||
expect(box.cx).toBeCloseTo(123)
|
||||
})*/
|
||||
})
|
||||
|
||||
describe('cy()', function() {
|
||||
it('returns the value of cy without an argument', function() {
|
||||
var box = text.bbox()
|
||||
expect(text.cy()).toBe(box.cy)
|
||||
})
|
||||
it('sets the value of cy with the first argument', function() {
|
||||
text.cy(345)
|
||||
var box = text.bbox()
|
||||
expect(Math.round(box.cy * 10) / 10).toBe(345)
|
||||
})
|
||||
})
|
||||
|
||||
describe('move()', function() {
|
||||
it('sets the x and y position', function() {
|
||||
text.move(123,456)
|
||||
expect(text.node.getAttribute('x')).toBe('123')
|
||||
expect(text.y()).toBeCloseTo(456)
|
||||
})
|
||||
})
|
||||
|
||||
describe('center()', function() {
|
||||
it('sets the cx and cy position', function() {
|
||||
text.center(321, 567)
|
||||
var box = text.bbox()
|
||||
expect(+text.node.getAttribute('x') + box.width / 2).toBeCloseTo(321, 1)
|
||||
expect(text.y() + box.height / 2).toBeCloseTo(567)
|
||||
})
|
||||
})
|
||||
|
||||
describe('size()', function() {
|
||||
it('should define the width and height of the element', function() {
|
||||
text.size(50)
|
||||
expect(text.attr('font-size').valueOf()).toBe(50)
|
||||
})
|
||||
})
|
||||
|
||||
describe('translate()', function() {
|
||||
it('sets the translation of an element', function() {
|
||||
text.transform({ x: 12, y: 12 })
|
||||
expect(text.node.getAttribute('transform')).toBe('matrix(1,0,0,1,12,12)')
|
||||
})
|
||||
})
|
||||
|
||||
describe('text()', function() {
|
||||
it('adds content in a nested tspan', function() {
|
||||
text.text('It is a bear!')
|
||||
expect(text.node.childNodes[0].nodeType).toBe(1)
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('It is a bear!')
|
||||
})
|
||||
it('adds content in a nested tspan even with an empty string', function() {
|
||||
text.text('')
|
||||
expect(text.node.childNodes[0].nodeType).toBe(1)
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('')
|
||||
})
|
||||
it('creates multiple lines with a newline separated string', function() {
|
||||
text.text('It is\nJUST\na bear!')
|
||||
expect(text.node.childNodes.length).toBe(3)
|
||||
})
|
||||
it('restores the content from the dom', function() {
|
||||
text.text('It is\nJUST\na bear!')
|
||||
expect(text.text()).toBe('It is\nJUST\na bear!')
|
||||
})
|
||||
it('gets the given content of a text element without an argument', function() {
|
||||
text.text('It is another bear!')
|
||||
expect(text.node.childNodes[0].nodeType).toBe(1)
|
||||
expect(text.text()).toMatch('It is another bear!')
|
||||
})
|
||||
it('accepts a block as first arguments', function() {
|
||||
text.text(function(add) {
|
||||
add.tspan('mastaba')
|
||||
add.plain('hut')
|
||||
})
|
||||
expect(text.node.childNodes[0].nodeType).toBe(1)
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('mastaba')
|
||||
expect(text.node.childNodes[1].nodeType).toBe(3)
|
||||
expect(text.node.childNodes[1].data).toBe('hut')
|
||||
})
|
||||
})
|
||||
|
||||
describe('plain()', function() {
|
||||
it('adds content without a tspan', function() {
|
||||
text.plain('It is a bear!')
|
||||
expect(text.node.childNodes[0].nodeType).toBe(3)
|
||||
expect(text.node.childNodes[0].data).toBe('It is a bear!')
|
||||
})
|
||||
it('clears content before adding new content', function() {
|
||||
text.plain('It is not a bear!')
|
||||
expect(text.node.childNodes.length).toBe(1)
|
||||
expect(text.node.childNodes[0].data).toBe('It is not a bear!')
|
||||
})
|
||||
it('restores the content from the dom', function() {
|
||||
text.plain('Just plain text!')
|
||||
expect(text.text()).toBe('Just plain text!')
|
||||
})
|
||||
})
|
||||
|
||||
describe('tspan()', function() {
|
||||
it('adds content in a tspan', function() {
|
||||
text.tspan('It is a bear!')
|
||||
expect(text.node.childNodes[0].nodeType).toBe(1)
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('It is a bear!')
|
||||
})
|
||||
it('clears content before adding new content', function() {
|
||||
text.tspan('It is not a bear!')
|
||||
expect(text.node.childNodes.length).toBe(1)
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('It is not a bear!')
|
||||
})
|
||||
})
|
||||
|
||||
describe('clear()', function() {
|
||||
it('removes all content', function() {
|
||||
text.text(function(add) {
|
||||
add.tspan('The first.')
|
||||
add.tspan('The second.')
|
||||
add.tspan('The third.')
|
||||
})
|
||||
expect(text.node.childNodes.length).toBe(3)
|
||||
text.clear()
|
||||
expect(text.node.childNodes.length).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('lines()', function() {
|
||||
it('gets an array of individual lines as an instance of SVG.Set', function() {
|
||||
var l1, l2, l3
|
||||
text.text(function(add) {
|
||||
l1 = add.tspan('The first.')
|
||||
l2 = add.tspan('The second.')
|
||||
l3 = add.tspan('The third.')
|
||||
})
|
||||
expect(text.lines().length()).toBe(3)
|
||||
expect(text.lines().get(0)).toBe(l1)
|
||||
expect(text.lines().get(1)).toBe(l2)
|
||||
expect(text.lines().get(2)).toBe(l3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('length()', function() {
|
||||
it('gets total length of text', function() {
|
||||
text.text(function(add) {
|
||||
add.tspan('The first.')
|
||||
add.tspan('The second.')
|
||||
add.tspan('The third.')
|
||||
})
|
||||
expect(text.length()).toBeCloseTo(text.lines().get(0).length() + text.lines().get(1).length() + text.lines().get(2).length(), 3)
|
||||
})
|
||||
})
|
||||
|
||||
describe('build()', function() {
|
||||
it('enables adding multiple plain text nodes when given true', function() {
|
||||
text.clear().build(true)
|
||||
text.plain('A great piece!')
|
||||
text.plain('Another great piece!')
|
||||
expect(text.node.childNodes[0].data).toBe('A great piece!')
|
||||
expect(text.node.childNodes[1].data).toBe('Another great piece!')
|
||||
})
|
||||
it('enables adding multiple tspan nodes when given true', function() {
|
||||
text.clear().build(true)
|
||||
text.tspan('A great piece!')
|
||||
text.tspan('Another great piece!')
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('A great piece!')
|
||||
expect(text.node.childNodes[1].childNodes[0].data).toBe('Another great piece!')
|
||||
})
|
||||
it('disables adding multiple plain text nodes when given false', function() {
|
||||
text.clear().build(true)
|
||||
text.plain('A great piece!')
|
||||
text.build(false).plain('Another great piece!')
|
||||
expect(text.node.childNodes[0].data).toBe('Another great piece!')
|
||||
expect(text.node.childNodes[1]).toBe(undefined)
|
||||
})
|
||||
it('disables adding multiple tspan nodes when given false', function() {
|
||||
text.clear().build(true)
|
||||
text.tspan('A great piece!')
|
||||
text.build(false).tspan('Another great piece!')
|
||||
expect(text.node.childNodes[0].childNodes[0].data).toBe('Another great piece!')
|
||||
expect(text.node.childNodes[1]).toBe(undefined)
|
||||
})
|
||||
})
|
||||
|
||||
describe('setData()', function() {
|
||||
it('read all data from the svgjs:data attribute and assign it to el.dom', function(){
|
||||
|
||||
text.attr('svgjs:data', '{"foo":"bar","leading":"3px"}')
|
||||
text.setData(JSON.parse(text.attr('svgjs:data')))
|
||||
|
||||
expect(text.dom.foo).toBe('bar')
|
||||
expect(text.dom.leading instanceof SVG.Number).toBeTruthy()
|
||||
expect(text.dom.leading.value).toBe(3)
|
||||
expect(text.dom.leading.unit).toBe('px')
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
describe('TextPath', function() {
|
||||
var text
|
||||
, data = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100'
|
||||
|
||||
beforeEach(function() {
|
||||
text = draw.text('We go up, then we go down, then up again')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('path()', function() {
|
||||
it('returns the text element', function() {
|
||||
expect(text.path(data)).toBe(text)
|
||||
})
|
||||
it('creates a textPath node in the text element', function() {
|
||||
text.path(data)
|
||||
expect(text.node.firstChild.nodeName).toBe('textPath')
|
||||
})
|
||||
})
|
||||
|
||||
describe('textPath()', function() {
|
||||
it('creates a reference to the textPath', function() {
|
||||
expect(text.path(data).textPath() instanceof SVG.TextPath).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('track()', function() {
|
||||
it('creates a reference to the path', function() {
|
||||
expect(text.path(data).track() instanceof SVG.Path).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('array()', function() {
|
||||
it('return the path array of the underlying path', function() {
|
||||
expect(text.path(data).array()).toEqual(new SVG.PathArray(data))
|
||||
})
|
||||
it('return null if there is no underlying path', function () {
|
||||
expect(text.array()).toBe(null)
|
||||
})
|
||||
})
|
||||
|
||||
describe('plot()', function() {
|
||||
it('change the array of the underlying path when a string is passed', function() {
|
||||
expect(text.path().plot(data)).toBe(text)
|
||||
expect(text.array()).toEqual(new SVG.PathArray(data))
|
||||
})
|
||||
it('do nothing when a string is passed and there is no underlying path', function() {
|
||||
expect(text.plot(data)).toBe(text)
|
||||
expect(text.array()).toEqual(null)
|
||||
})
|
||||
it('return the path array of the underlying path when no arguments is passed', function () {
|
||||
text.path(data)
|
||||
expect(text.plot()).toBe(text.array())
|
||||
expect(text.plot()).not.toBe(null)
|
||||
})
|
||||
it('return null when no arguments is passed and there is no underlying path', function () {
|
||||
expect(text.plot()).toBe(null)
|
||||
})
|
||||
})
|
||||
})
|
||||
+282
@@ -0,0 +1,282 @@
|
||||
describe('Transformations:', function() {
|
||||
var translated, scaled, rotated, skewed
|
||||
|
||||
beforeEach(function() {
|
||||
translated = draw.rect(100,100).translate(100,100)
|
||||
scaled = draw.rect(100,100).scale(2)
|
||||
rotated = draw.rect(100,100).rotate(45, 50, 50)
|
||||
skewed = draw.rect(100,100).skew(30)
|
||||
})
|
||||
|
||||
/* SVG.Transformation is not tested because it is an abstract prototype */
|
||||
|
||||
describe('SVG.Transformation', function() {
|
||||
it('marks the transformation as inversed when inverse flag given', function() {
|
||||
var trans = new SVG.Transformation([], true)
|
||||
expect(trans.inversed).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('SVG.Translate', function() {
|
||||
var trans
|
||||
|
||||
beforeEach(function(){
|
||||
trans = new SVG.Translate(translated.transform())
|
||||
})
|
||||
|
||||
|
||||
it('creates an object of type SVG.Transformation', function() {
|
||||
expect(trans instanceof SVG.Transformation).toBeTruthy()
|
||||
})
|
||||
|
||||
it('uses transformedX and transformedY as arguments', function() {
|
||||
expect(trans.arguments).toEqual(['transformedX', 'transformedY'])
|
||||
})
|
||||
|
||||
it('s method is translate()', function() {
|
||||
expect(trans.method).toEqual('translate')
|
||||
})
|
||||
|
||||
it('sets the necessary parameters at creation', function() {
|
||||
expect(trans.transformedX).toBe(100)
|
||||
expect(trans.transformedY).toBe(100)
|
||||
})
|
||||
|
||||
describe('undo', function() {
|
||||
it('sets the undo matrix which can undo the translation', function() {
|
||||
var extracted = (new SVG.Matrix(1,0,0,1,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.toString()).toEqual('matrix(1,0,0,1,-20,-20)')
|
||||
|
||||
var extracted = (new SVG.Matrix(10,0,0,10,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.toString()).toEqual('matrix(1,0,0,1,-2,-2)')
|
||||
|
||||
var extracted = (new SVG.Matrix(10,50,50,30,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.e).toBeCloseTo(-extracted.transformedX)
|
||||
expect(trans._undo.f).toBeCloseTo(-extracted.transformedY)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at', function() {
|
||||
it('creates a matrix at a certain position', function() {
|
||||
expect(trans.at(0.3).toString()).toEqual('matrix(1,0,0,1,30,30)')
|
||||
})
|
||||
it('returns the inversed matrix from a specific position when created with inverse flag', function() {
|
||||
expect((new SVG.Translate(translated.transform(), true)).at(0.3).toString()).toEqual('matrix(1,0,0,1,-30,-30)')
|
||||
})
|
||||
it('returns the resulting transformation which has to be made to set an absolute translation', function() {
|
||||
trans.undo(new SVG.Matrix(10,50,50,30,20,20).extract())
|
||||
|
||||
expect(trans.at(0.4).a).toEqual(1)
|
||||
expect(trans.at(0.4).b).toEqual(0)
|
||||
expect(trans.at(0.4).c).toEqual(0)
|
||||
expect(trans.at(0.4).d).toEqual(1)
|
||||
expect(trans.at(0.4).e).toBeCloseTo(100 * 0.4 + trans._undo.e * 0.4)
|
||||
expect(trans.at(0.4).f).toBeCloseTo(100 * 0.4 + trans._undo.f * 0.4)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('SVG.Rotate', function() {
|
||||
var trans
|
||||
|
||||
beforeEach(function(){
|
||||
trans = new SVG.Rotate(45, 50, 50)
|
||||
})
|
||||
|
||||
|
||||
it('creates an object of type SVG.Transformation', function() {
|
||||
expect(trans instanceof SVG.Transformation).toBeTruthy()
|
||||
})
|
||||
|
||||
it('uses rotation, cx and cy as arguments', function() {
|
||||
expect(trans.arguments).toEqual(['rotation', 'cx', 'cy'])
|
||||
})
|
||||
|
||||
it('s method is rotate()', function() {
|
||||
expect(trans.method).toEqual('rotate')
|
||||
})
|
||||
|
||||
it('sets the necessary parameters at creation', function() {
|
||||
expect(trans.rotation).toBe(45)
|
||||
expect(trans.cx).toBe(50)
|
||||
expect(trans.cy).toBe(50)
|
||||
})
|
||||
|
||||
describe('undo', function() {
|
||||
it('sets an undo object which holds rotation', function() {
|
||||
var extracted = (new SVG.Matrix(1,0,0,1,0,0)).rotate(20, 50, 50).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.rotation).toBeCloseTo(20)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at', function() {
|
||||
it('creates a matrix at a certain position', function() {
|
||||
expect(trans.at(0.3).toString()).toEqual((new SVG.Matrix()).rotate(0.3 * 45, 50, 50).toString())
|
||||
})
|
||||
it('returns the resulting transformation which has to be made to set an absolute translation', function() {
|
||||
trans.undo((new SVG.Matrix()).rotate(20, 50, 50).extract())
|
||||
|
||||
expect(trans.at(0.4).a).toBeCloseTo(1,1)
|
||||
expect(trans.at(0.4).b).toEqual(jasmine.any(Number))
|
||||
expect(trans.at(0.4).c).toEqual(jasmine.any(Number))
|
||||
expect(trans.at(0.4).d).toBeCloseTo(1,1)
|
||||
expect(trans.at(0.4).e).toEqual(jasmine.any(Number))
|
||||
expect(trans.at(0.4).f).toEqual(jasmine.any(Number))
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('SVG.Scale', function() {
|
||||
var trans
|
||||
|
||||
beforeEach(function(){
|
||||
trans = new SVG.Scale(2,2,50,50)
|
||||
})
|
||||
|
||||
|
||||
it('creates an object of type SVG.Transformation', function() {
|
||||
expect(trans instanceof SVG.Transformation).toBeTruthy()
|
||||
})
|
||||
|
||||
it('uses scaleX, scaleY, cx and cy as arguments', function() {
|
||||
expect(trans.arguments).toEqual(['scaleX', 'scaleY', 'cx', 'cy'])
|
||||
})
|
||||
|
||||
it('s method is scale()', function() {
|
||||
expect(trans.method).toEqual('scale')
|
||||
})
|
||||
|
||||
it('sets the necessary parameters at creation', function() {
|
||||
expect(trans.scaleX).toBe(2)
|
||||
expect(trans.scaleY).toBe(2)
|
||||
expect(trans.cx).toBe(50)
|
||||
expect(trans.cy).toBe(50)
|
||||
})
|
||||
|
||||
describe('undo', function() {
|
||||
it('sets the undo matrix which can undo the translation', function() {
|
||||
var extracted = (new SVG.Matrix(4,0,0,4,0,0)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.toString()).toEqual('matrix(0.25,0,0,0.25,37.5,37.5)')
|
||||
|
||||
var extracted = (new SVG.Matrix(10,0,0,10,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.a).toBeCloseTo(1/extracted.scaleX)
|
||||
expect(trans._undo.d).toBeCloseTo(1/extracted.scaleY)
|
||||
expect(trans._undo.e).toBeCloseTo(45)
|
||||
expect(trans._undo.f).toBeCloseTo(45)
|
||||
|
||||
var extracted = (new SVG.Matrix(10,50,50,30,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.a).toBeCloseTo(1/extracted.scaleX)
|
||||
expect(trans._undo.d).toBeCloseTo(1/extracted.scaleY)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at', function() {
|
||||
it('creates a matrix at a certain position', function() {
|
||||
expect(trans.at(0.75).toString()).toEqual('matrix(1.75,0,0,1.75,-37.5,-37.5)')
|
||||
})
|
||||
it('returns the inversed matrix from a specific position when created with inverse flag', function() {
|
||||
var morphed = (new SVG.Scale(scaled.transform(2,2,50,50), true)).at(0.25)
|
||||
|
||||
expect(morphed.a).toBeCloseTo(0.8)
|
||||
expect(morphed.d).toBeCloseTo(0.8)
|
||||
})
|
||||
it('returns the resulting transformation which has to be made to set an absolute translation', function() {
|
||||
|
||||
var morphed = trans.undo((new SVG.Matrix(10,0,0,10,0,0)).extract()).at(0.5)
|
||||
|
||||
expect(morphed.a).toBeCloseTo(0.6)
|
||||
expect(morphed.b).toEqual(0)
|
||||
expect(morphed.c).toEqual(0)
|
||||
expect(morphed.d).toBeCloseTo(0.6)
|
||||
expect(morphed.e).toBeCloseTo(20)
|
||||
expect(morphed.f).toBeCloseTo(20)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
describe('SVG.Skew', function() {
|
||||
var trans
|
||||
|
||||
beforeEach(function(){
|
||||
trans = new SVG.Skew(30,-30,50,50)
|
||||
})
|
||||
|
||||
|
||||
it('creates an object of type SVG.Transformation', function() {
|
||||
expect(trans instanceof SVG.Transformation).toBeTruthy()
|
||||
})
|
||||
|
||||
it('uses scaleX, scaleY, cx and cy as arguments', function() {
|
||||
expect(trans.arguments).toEqual(['skewX', 'skewY', 'cx', 'cy'])
|
||||
})
|
||||
|
||||
it('s method is skew()', function() {
|
||||
expect(trans.method).toEqual('skew')
|
||||
})
|
||||
|
||||
it('sets the necessary parameters at creation', function() {
|
||||
expect(trans.skewX).toBe(30)
|
||||
expect(trans.skewY).toBe(-30)
|
||||
expect(trans.cx).toBe(50)
|
||||
expect(trans.cy).toBe(50)
|
||||
})
|
||||
|
||||
describe('undo', function() {
|
||||
it('sets the undo matrix which can undo the translation', function() {
|
||||
var extracted = (new SVG.Matrix()).skew(90, 90, 0, 0).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.a).toBeCloseTo(0)
|
||||
expect(trans._undo.b).toBeCloseTo(0)
|
||||
expect(trans._undo.c).toBeCloseTo(0)
|
||||
expect(trans._undo.d).toBeCloseTo(0)
|
||||
expect(trans._undo.e).toBeCloseTo(50)
|
||||
expect(trans._undo.f).toBeCloseTo(50)
|
||||
|
||||
var extracted = (new SVG.Matrix(10,0,0,10,20,20)).extract()
|
||||
trans.undo(extracted)
|
||||
expect(trans._undo.a).toBeCloseTo(1)
|
||||
expect(trans._undo.b).toBeCloseTo(0)
|
||||
expect(trans._undo.c).toBeCloseTo(0)
|
||||
expect(trans._undo.d).toBeCloseTo(1)
|
||||
expect(trans._undo.e).toBeCloseTo(0)
|
||||
expect(trans._undo.f).toBeCloseTo(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at', function() {
|
||||
it('creates a matrix at a certain position', function() {
|
||||
expect(trans.at(0.75)).toEqual((new SVG.Matrix()).morph((new SVG.Matrix()).skew(30, -30, 50, 50)).at(0.75))
|
||||
})
|
||||
it('returns the inversed matrix from a specific position when created with inverse flag', function() {
|
||||
var morphed = (new SVG.Scale(skewed.transform(20,-20,50,50), true)).at(0.25)
|
||||
|
||||
expect(morphed.a).toBeCloseTo(0.963)
|
||||
expect(morphed.b).toBeCloseTo(0)
|
||||
expect(morphed.c).toBeCloseTo(0)
|
||||
expect(morphed.d).toBeCloseTo(0.963)
|
||||
expect(morphed.e).toBeCloseTo(0)
|
||||
expect(morphed.f).toBeCloseTo(0)
|
||||
})
|
||||
it('returns the resulting transformation which has to be made to set an absolute translation', function() {
|
||||
|
||||
var morphed = trans.undo((new SVG.Matrix(10,0,0,10,0,0)).skew(20, 30, 20, 10).extract()).at(0.5)
|
||||
|
||||
expect(morphed.a).toBeCloseTo(1.266)
|
||||
expect(morphed.b).toBeCloseTo(-0.7310)
|
||||
expect(morphed.c).toBeCloseTo(0.1351)
|
||||
expect(morphed.d).toBeCloseTo(0.9220)
|
||||
expect(morphed.e).toBeCloseTo(-20.05593)
|
||||
expect(morphed.f).toBeCloseTo(40.4468)
|
||||
})
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+46
@@ -0,0 +1,46 @@
|
||||
describe('Tspan', function() {
|
||||
var text, tspan
|
||||
|
||||
beforeEach(function() {
|
||||
text = draw.text(loremIpsum)
|
||||
tspan = text.tspan('Hello World')
|
||||
})
|
||||
|
||||
afterEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('newLine()', function() {
|
||||
it('converts the tspan to a line', function() {
|
||||
tspan = text.tspan('Hello World')
|
||||
expect(tspan.newLine().dom.newLined).toBeTruthy()
|
||||
})
|
||||
})
|
||||
|
||||
describe('text()', function() {
|
||||
it('returns the text of the tspan without newline when not newlined', function() {
|
||||
tspan = text.tspan('Hello World')
|
||||
expect(tspan.text()).toBe('Hello World')
|
||||
})
|
||||
it('returns the text of the tspan with newline when newlined', function() {
|
||||
tspan = text.tspan('Hello World').newLine()
|
||||
expect(tspan.text()).toBe('Hello World\n')
|
||||
})
|
||||
it('calls the function when function given', function() {
|
||||
var spy = jasmine.createSpy('dummy')
|
||||
tspan = text.tspan('Hello World')
|
||||
tspan.text(spy)
|
||||
expect(spy).toHaveBeenCalledWith(tspan)
|
||||
})
|
||||
})
|
||||
|
||||
describe('dx()', function() {
|
||||
it('gets the dx value with no argument', function() {
|
||||
tspan.attr('dx', 25)
|
||||
expect(tspan.dx()).toBe(25)
|
||||
})
|
||||
it('sets the dx value whith the first argument', function() {
|
||||
expect(tspan.dx(25).attr('dx')).toBe(25)
|
||||
})
|
||||
})
|
||||
})
|
||||
+43
@@ -0,0 +1,43 @@
|
||||
describe('Use', function() {
|
||||
var use
|
||||
|
||||
describe('on a container element', function() {
|
||||
var rect
|
||||
|
||||
beforeEach(function() {
|
||||
rect = draw.rect(100,100)
|
||||
use = draw.use(rect)
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Use', function() {
|
||||
expect(use instanceof SVG.Use).toBe(true)
|
||||
})
|
||||
|
||||
it('sets the target element id to its href attribute', function() {
|
||||
expect(use.node.getAttributeNS(SVG.xlink, 'href')).toBe('#' + rect)
|
||||
})
|
||||
|
||||
it('adopts the geometry of the target element', function() {
|
||||
expect(use.bbox()).toEqual(rect.bbox())
|
||||
})
|
||||
})
|
||||
|
||||
describe('on an external path', function() {
|
||||
var file = 'http://upload.wikimedia.org/wikipedia/commons/8/84/Example.svg'
|
||||
, id = 'flowRoot1882'
|
||||
|
||||
beforeEach(function() {
|
||||
use = draw.use(id, file)
|
||||
})
|
||||
|
||||
it('creates an instance of SVG.Use', function() {
|
||||
expect(use instanceof SVG.Use).toBe(true)
|
||||
})
|
||||
|
||||
it('sets the target element id and file path to its href attribute', function() {
|
||||
expect(use.node.getAttributeNS(SVG.xlink, 'href')).toBe(file + '#' + id)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
})
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
describe('SVG.utils', function() {
|
||||
describe('degrees()', function() {
|
||||
it('converts radiant to degrees', function() {
|
||||
expect(SVG.utils.degrees(Math.PI)).toBe(180)
|
||||
})
|
||||
it('maps to 0 - 360 degree only', function() {
|
||||
expect(SVG.utils.degrees(2.5 * Math.PI)).toBe(90)
|
||||
})
|
||||
})
|
||||
})
|
||||
+162
@@ -0,0 +1,162 @@
|
||||
describe('Viewbox', function() {
|
||||
var viewbox
|
||||
|
||||
beforeEach(function() {
|
||||
draw.clear()
|
||||
})
|
||||
|
||||
describe('initialization', function() {
|
||||
|
||||
|
||||
it('creates a new viewbox with default values', function() {
|
||||
viewbox = new SVG.ViewBox()
|
||||
|
||||
expect(viewbox.x).toBe(0)
|
||||
expect(viewbox.y).toBe(0)
|
||||
expect(viewbox.width).toBe(0)
|
||||
expect(viewbox.height).toBe(0)
|
||||
})
|
||||
|
||||
|
||||
|
||||
it('creates a new viewbox from parsed string', function() {
|
||||
viewbox = new SVG.ViewBox('10. 100 200 300')
|
||||
|
||||
expect(viewbox.x).toBe(10)
|
||||
expect(viewbox.y).toBe(100)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(300)
|
||||
})
|
||||
|
||||
|
||||
|
||||
it('creates a new viewbox from array', function() {
|
||||
viewbox = new SVG.ViewBox([10, 100, 200, 300])
|
||||
|
||||
expect(viewbox.x).toBe(10)
|
||||
expect(viewbox.y).toBe(100)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(300)
|
||||
})
|
||||
|
||||
|
||||
|
||||
it('creates a new viewbox from object', function() {
|
||||
viewbox = new SVG.ViewBox({x:10, y:100, width:200, height:300})
|
||||
|
||||
expect(viewbox.x).toBe(10)
|
||||
expect(viewbox.y).toBe(100)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(300)
|
||||
})
|
||||
|
||||
|
||||
|
||||
it('creates a new viewbox from 4 arguments given', function() {
|
||||
viewbox = new SVG.ViewBox(10, 100, 200, 300)
|
||||
|
||||
expect(viewbox.x).toBe(10)
|
||||
expect(viewbox.y).toBe(100)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(300)
|
||||
})
|
||||
|
||||
|
||||
it('creates a new viewbox from parsed string with exponential values', function() {
|
||||
viewbox = new SVG.ViewBox('-1.12e1 1e-2 +2e2 +.3e+4')
|
||||
|
||||
expect(viewbox.x).toBe(-11.2)
|
||||
expect(viewbox.y).toBe(0.01)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(3000)
|
||||
})
|
||||
|
||||
it('creates a new viewbox with element given', function() {
|
||||
draw.attr('viewBox', '-1.12e1 1e-2 +2e2 +.3e+4')
|
||||
viewbox = new SVG.ViewBox(draw)
|
||||
|
||||
expect(viewbox.x).toBe(-11.2)
|
||||
expect(viewbox.y).toBe(0.01)
|
||||
expect(viewbox.width).toBe(200)
|
||||
expect(viewbox.height).toBe(3000)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
|
||||
describe('viewbox()', function() {
|
||||
|
||||
beforeEach(function() {
|
||||
draw.attr('viewBox', null)
|
||||
})
|
||||
afterEach(function() {
|
||||
draw.attr('viewBox', null)
|
||||
})
|
||||
|
||||
it('should set the viewbox when four arguments are provided', function() {
|
||||
draw.viewbox(0,0,100,100)
|
||||
expect(draw.node.getAttribute('viewBox')).toBe('0 0 100 100')
|
||||
})
|
||||
it('should set the viewbox when an object is provided as first argument', function() {
|
||||
draw.viewbox({ x: 0, y: 0, width: 50, height: 50 })
|
||||
expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50')
|
||||
})
|
||||
it('should set the viewbox when a string is provided as first argument', function() {
|
||||
draw.viewbox('0 0 50 50')
|
||||
expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50')
|
||||
})
|
||||
it('should set the viewbox when an array is provided as first argument', function() {
|
||||
draw.viewbox([0, 0, 50, 50])
|
||||
expect(draw.node.getAttribute('viewBox')).toBe('0 0 50 50')
|
||||
})
|
||||
it('should accept negative values', function() {
|
||||
draw.size(100,100).viewbox(-100, -100, 50, 50)
|
||||
expect(draw.node.getAttribute('viewBox')).toEqual('-100 -100 50 50')
|
||||
})
|
||||
it('should get the viewbox if no arguments are given', function() {
|
||||
draw.viewbox(0, 0, 100, 100)
|
||||
expect(draw.viewbox()).toEqual(new SVG.ViewBox(draw))
|
||||
})
|
||||
it('should define the zoom of the viewbox in relation to the canvas size', function() {
|
||||
draw.size(100,100).viewbox(0,0,50,50)
|
||||
expect(draw.viewbox().zoom).toEqual(100 / 50)
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
describe('morph()', function() {
|
||||
it('stores a given viewbox for morphing', function() {
|
||||
var viewbox1 = new SVG.ViewBox(10, 100, 200, 300)
|
||||
, viewbox2 = new SVG.ViewBox(50, -100, 300, 300)
|
||||
|
||||
viewbox1.morph(viewbox2)
|
||||
|
||||
expect(viewbox1.destination).toEqual(viewbox2)
|
||||
})
|
||||
it('stores a clone, not the given viewbox itself', function() {
|
||||
var viewbox1 = new SVG.ViewBox(10, 100, 200, 300)
|
||||
, viewbox2 = new SVG.ViewBox(50, -100, 300, 300)
|
||||
|
||||
viewbox1.morph(viewbox2)
|
||||
|
||||
expect(viewbox1.destination).not.toBe(viewbox2)
|
||||
})
|
||||
})
|
||||
|
||||
describe('at()', function() {
|
||||
it('returns a morphed viewbox at a given position', function() {
|
||||
var viewbox1 = new SVG.ViewBox(10, 100, 200, 300)
|
||||
, viewbox2 = new SVG.ViewBox(50, -100, 300, 300)
|
||||
, viewbox3 = viewbox1.morph(viewbox2).at(0.5)
|
||||
|
||||
expect(viewbox1.toString()).toBe('10 100 200 300')
|
||||
expect(viewbox2.toString()).toBe('50 -100 300 300')
|
||||
expect(viewbox3.toString()).toBe('30 0 250 300')
|
||||
})
|
||||
it('returns itself when no destination given', function() {
|
||||
var viewbox = new SVG.ViewBox(10, 100, 200, 300)
|
||||
expect(viewbox.at(0.5)).toBe(viewbox)
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
{
|
||||
"spec_dir": "spec/spec",
|
||||
"spec_files": [
|
||||
"!(helpers).js"
|
||||
],
|
||||
"helpers": [
|
||||
"helpers.js"
|
||||
]
|
||||
}
|
||||
Reference in New Issue
Block a user