- Fix: Regression for text and tspan elements as far as

`captureTextNodes` with canvg (inheriting class had set
  `captureTextNodes` too late)
- Fix: Avoid errors for tspan passed to `getGradient`
This commit is contained in:
Brett Zamir
2018-07-22 23:38:41 -07:00
parent d71ca48654
commit 5d0dd85507
2 changed files with 23 additions and 15 deletions

View File

@@ -1,3 +1,10 @@
# 3.0.0-rc.2
- Fix: Regression for `text` and `tspan` elements as far as
`captureTextNodes` with canvg (inheriting class had set
`captureTextNodes` too late)
- Fix: Avoid errors for tspan passed to `getGradient`
# 3.0.0-rc.1 # 3.0.0-rc.1
- Security fix: 'extPath', 'imgPath', 'extIconsPath', 'canvgPath', - Security fix: 'extPath', 'imgPath', 'extIconsPath', 'canvgPath',

View File

@@ -721,6 +721,7 @@ function build (opts) {
svg.Element.ElementBase = class { svg.Element.ElementBase = class {
constructor (node) { constructor (node) {
this.captureTextNodes = arguments[1]; // Argument from inheriting class
this.attributes = {}; this.attributes = {};
this.styles = {}; this.styles = {};
this.children = []; this.children = [];
@@ -1740,7 +1741,8 @@ function build (opts) {
// linear gradient element // linear gradient element
svg.Element.linearGradient = class extends svg.Element.GradientBase { svg.Element.linearGradient = class extends svg.Element.GradientBase {
getGradient (ctx, element) { getGradient (ctx, element) {
const bb = this.gradientUnits === 'objectBoundingBox' const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
const bb = useBB
? element.getBoundingBox() ? element.getBoundingBox()
: null; : null;
@@ -1755,16 +1757,16 @@ function build (opts) {
this.attribute('y2', true).value = 0; this.attribute('y2', true).value = 0;
} }
const x1 = (this.gradientUnits === 'objectBoundingBox' const x1 = (useBB
? bb.x() + bb.width() * this.attribute('x1').numValue() ? bb.x() + bb.width() * this.attribute('x1').numValue()
: this.attribute('x1').toPixels('x')); : this.attribute('x1').toPixels('x'));
const y1 = (this.gradientUnits === 'objectBoundingBox' const y1 = (useBB
? bb.y() + bb.height() * this.attribute('y1').numValue() ? bb.y() + bb.height() * this.attribute('y1').numValue()
: this.attribute('y1').toPixels('y')); : this.attribute('y1').toPixels('y'));
const x2 = (this.gradientUnits === 'objectBoundingBox' const x2 = (useBB
? bb.x() + bb.width() * this.attribute('x2').numValue() ? bb.x() + bb.width() * this.attribute('x2').numValue()
: this.attribute('x2').toPixels('x')); : this.attribute('x2').toPixels('x'));
const y2 = (this.gradientUnits === 'objectBoundingBox' const y2 = (useBB
? bb.y() + bb.height() * this.attribute('y2').numValue() ? bb.y() + bb.height() * this.attribute('y2').numValue()
: this.attribute('y2').toPixels('y')); : this.attribute('y2').toPixels('y'));
@@ -1776,33 +1778,34 @@ function build (opts) {
// radial gradient element // radial gradient element
svg.Element.radialGradient = class extends svg.Element.GradientBase { svg.Element.radialGradient = class extends svg.Element.GradientBase {
getGradient (ctx, element) { getGradient (ctx, element) {
const bb = element.getBoundingBox(); const useBB = this.gradientUnits === 'objectBoundingBox' && element.getBoundingBox;
const bb = useBB ? element.getBoundingBox() : null;
if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%'; if (!this.attribute('cx').hasValue()) this.attribute('cx', true).value = '50%';
if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%'; if (!this.attribute('cy').hasValue()) this.attribute('cy', true).value = '50%';
if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%'; if (!this.attribute('r').hasValue()) this.attribute('r', true).value = '50%';
const cx = (this.gradientUnits === 'objectBoundingBox' const cx = (useBB
? bb.x() + bb.width() * this.attribute('cx').numValue() ? bb.x() + bb.width() * this.attribute('cx').numValue()
: this.attribute('cx').toPixels('x')); : this.attribute('cx').toPixels('x'));
const cy = (this.gradientUnits === 'objectBoundingBox' const cy = (useBB
? bb.y() + bb.height() * this.attribute('cy').numValue() ? bb.y() + bb.height() * this.attribute('cy').numValue()
: this.attribute('cy').toPixels('y')); : this.attribute('cy').toPixels('y'));
let fx = cx; let fx = cx;
let fy = cy; let fy = cy;
if (this.attribute('fx').hasValue()) { if (this.attribute('fx').hasValue()) {
fx = (this.gradientUnits === 'objectBoundingBox' fx = (useBB
? bb.x() + bb.width() * this.attribute('fx').numValue() ? bb.x() + bb.width() * this.attribute('fx').numValue()
: this.attribute('fx').toPixels('x')); : this.attribute('fx').toPixels('x'));
} }
if (this.attribute('fy').hasValue()) { if (this.attribute('fy').hasValue()) {
fy = (this.gradientUnits === 'objectBoundingBox' fy = (useBB
? bb.y() + bb.height() * this.attribute('fy').numValue() ? bb.y() + bb.height() * this.attribute('fy').numValue()
: this.attribute('fy').toPixels('y')); : this.attribute('fy').toPixels('y'));
} }
const r = (this.gradientUnits === 'objectBoundingBox' const r = (useBB
? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue() ? (bb.width() + bb.height()) / 2.0 * this.attribute('r').numValue()
: this.attribute('r').toPixels()); : this.attribute('r').toPixels());
@@ -2039,8 +2042,7 @@ function build (opts) {
// text element // text element
svg.Element.text = class extends svg.Element.RenderedElementBase { svg.Element.text = class extends svg.Element.RenderedElementBase {
constructor (node) { constructor (node) {
super(node); super(node, true);
this.captureTextNodes = true;
} }
setContext (ctx) { setContext (ctx) {
@@ -2211,8 +2213,7 @@ function build (opts) {
// tspan // tspan
svg.Element.tspan = class extends svg.Element.TextElementBase { svg.Element.tspan = class extends svg.Element.TextElementBase {
constructor (node) { constructor (node) {
super(node); super(node, true);
this.captureTextNodes = true;
this.text = node.nodeValue || node.text || ''; this.text = node.nodeValue || node.text || '';
} }