Skip to content

Commit c3c04a1

Browse files
author
Christoph Burgmer
committed
Remove workaround for missing resources. Latest browsers don't seem to benefit from it, it has a side effect of showing a flash of the rendered CSS showing up on the parent page, and injecting XHTML into an HTML parent seems to not load the document correctly anyway.
1 parent f646805 commit c3c04a1

7 files changed

+11
-346
lines changed

‎dist/rasterizeHTML.allinone.js

+3-4
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/rasterizeHTML.js

+3-76
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/*! rasterizeHTML.js - v0.9.1 - 2014-06-18
1+
/*! rasterizeHTML.js - v0.9.1 - 2014-06-21
22
* http://www.github.com/cburgmer/rasterizeHTML.js
33
* Copyright (c) 2014 Christoph Burgmer; Licensed MIT */
44
(function(root, factory) {
@@ -592,10 +592,6 @@
592592

593593
var module = {};
594594

595-
var asArray = function (arrayLike) {
596-
return Array.prototype.slice.call(arrayLike);
597-
};
598-
599595
var supportsBlobBuilding = function () {
600596
// Newer WebKit (under PhantomJS) seems to support blob building, but loading an image with the blob fails
601597
if (window.navigator.userAgent.indexOf("WebKit") >= 0 && window.navigator.userAgent.indexOf("Chrome") < 0) {
@@ -647,71 +643,6 @@
647643
}
648644
};
649645

650-
var createHiddenElement = function (doc, tagName) {
651-
var element = doc.createElement(tagName);
652-
// 'display: none' doesn't cut it, as browsers seem to be lazy loading CSS
653-
element.style.visibility = "hidden";
654-
element.style.width = "0px";
655-
element.style.height = "0px";
656-
element.style.position = "absolute";
657-
element.style.top = "-10000px";
658-
element.style.left = "-10000px";
659-
// We need to add the element to the document so that its content gets loaded
660-
doc.getElementsByTagName("body")[0].appendChild(element);
661-
return element;
662-
};
663-
664-
var getOrCreateHiddenDivWithId = function (doc, id) {
665-
var div = doc.getElementById(id);
666-
if (! div) {
667-
div = createHiddenElement(doc, "div");
668-
div.id = id;
669-
}
670-
671-
return div;
672-
};
673-
674-
var WORKAROUND_ID = "rasterizeHTML_js_FirefoxWorkaround";
675-
676-
var needsBackgroundImageWorkaround = function () {
677-
var firefoxMatch = window.navigator.userAgent.match(/Firefox\/(\d+).0/);
678-
return !firefoxMatch || !firefoxMatch[1] || parseInt(firefoxMatch[1], 10) < 17;
679-
};
680-
681-
var workAroundBrowserBugForBackgroundImages = function (svg, canvas) {
682-
// Firefox < 17, Chrome & Safari will (sometimes) not show an inlined background-image until the svg is
683-
// connected to the DOM it seems.
684-
var uniqueId = util.getConstantUniqueIdFor(svg),
685-
doc = canvas ? canvas.ownerDocument : window.document,
686-
workaroundDiv;
687-
688-
if (needsBackgroundImageWorkaround()) {
689-
workaroundDiv = getOrCreateHiddenDivWithId(doc, WORKAROUND_ID + uniqueId);
690-
workaroundDiv.innerHTML = svg;
691-
workaroundDiv.className = WORKAROUND_ID; // Make if findable for debugging & testing purposes
692-
}
693-
};
694-
695-
var workAroundWebkitBugIgnoringTheFirstRuleInCSS = function (doc) {
696-
// Works around bug with webkit ignoring the first rule in each style declaration when rendering the SVG to the
697-
// DOM. While this does not directly affect the process when rastering to canvas, this is needed for the
698-
// workaround found in workAroundBrowserBugForBackgroundImages();
699-
if (window.navigator.userAgent.indexOf("WebKit") >= 0) {
700-
asArray(doc.getElementsByTagName("style")).forEach(function (style) {
701-
style.textContent = "span {}\n" + style.textContent;
702-
});
703-
}
704-
};
705-
706-
var cleanUpAfterWorkAroundForBackgroundImages = function (svg, canvas) {
707-
var uniqueId = util.getConstantUniqueIdFor(svg),
708-
doc = canvas ? canvas.ownerDocument : window.document,
709-
div = doc.getElementById(WORKAROUND_ID + uniqueId);
710-
if (div) {
711-
div.parentNode.removeChild(div);
712-
}
713-
};
714-
715646
var zoomedElementSizingAttributes = function (size, zoomFactor) {
716647
var closestScaledWith, closestScaledHeight,
717648
offsetX, offsetY;
@@ -760,7 +691,6 @@
760691
module.getSvgForDocument = function (doc, size, zoomFactor) {
761692
var xhtml;
762693

763-
workAroundWebkitBugIgnoringTheFirstRuleInCSS(doc);
764694
xhtml = xmlserializer.serializeToString(doc);
765695

766696
browser.validateXHTML(xhtml);
@@ -782,7 +712,7 @@
782712
return {message: "Error rendering page"};
783713
};
784714

785-
module.renderSvg = function (svg, canvas) {
715+
module.renderSvg = function (svg) {
786716
var url, image,
787717
defer = ayepromise.defer(),
788718
resetEventHandlers = function () {
@@ -793,11 +723,8 @@
793723
if (url) {
794724
cleanUpUrl(url);
795725
}
796-
cleanUpAfterWorkAroundForBackgroundImages(svg, canvas);
797726
};
798727

799-
workAroundBrowserBugForBackgroundImages(svg, canvas);
800-
801728
url = buildImageUrl(svg);
802729

803730
image = new window.Image();
@@ -856,7 +783,7 @@
856783
return module.getSvgForDocument(doc, size, options.zoom);
857784
})
858785
.then(function (svg) {
859-
return module.renderSvg(svg, canvas);
786+
return module.renderSvg(svg);
860787
});
861788
};
862789

‎dist/rasterizeHTML.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/render.js

+2-75
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,6 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
33

44
var module = {};
55

6-
var asArray = function (arrayLike) {
7-
return Array.prototype.slice.call(arrayLike);
8-
};
9-
106
var supportsBlobBuilding = function () {
117
// Newer WebKit (under PhantomJS) seems to support blob building, but loading an image with the blob fails
128
if (window.navigator.userAgent.indexOf("WebKit") >= 0 && window.navigator.userAgent.indexOf("Chrome") < 0) {
@@ -58,71 +54,6 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
5854
}
5955
};
6056

61-
var createHiddenElement = function (doc, tagName) {
62-
var element = doc.createElement(tagName);
63-
// 'display: none' doesn't cut it, as browsers seem to be lazy loading CSS
64-
element.style.visibility = "hidden";
65-
element.style.width = "0px";
66-
element.style.height = "0px";
67-
element.style.position = "absolute";
68-
element.style.top = "-10000px";
69-
element.style.left = "-10000px";
70-
// We need to add the element to the document so that its content gets loaded
71-
doc.getElementsByTagName("body")[0].appendChild(element);
72-
return element;
73-
};
74-
75-
var getOrCreateHiddenDivWithId = function (doc, id) {
76-
var div = doc.getElementById(id);
77-
if (! div) {
78-
div = createHiddenElement(doc, "div");
79-
div.id = id;
80-
}
81-
82-
return div;
83-
};
84-
85-
var WORKAROUND_ID = "rasterizeHTML_js_FirefoxWorkaround";
86-
87-
var needsBackgroundImageWorkaround = function () {
88-
var firefoxMatch = window.navigator.userAgent.match(/Firefox\/(\d+).0/);
89-
return !firefoxMatch || !firefoxMatch[1] || parseInt(firefoxMatch[1], 10) < 17;
90-
};
91-
92-
var workAroundBrowserBugForBackgroundImages = function (svg, canvas) {
93-
// Firefox < 17, Chrome & Safari will (sometimes) not show an inlined background-image until the svg is
94-
// connected to the DOM it seems.
95-
var uniqueId = util.getConstantUniqueIdFor(svg),
96-
doc = canvas ? canvas.ownerDocument : window.document,
97-
workaroundDiv;
98-
99-
if (needsBackgroundImageWorkaround()) {
100-
workaroundDiv = getOrCreateHiddenDivWithId(doc, WORKAROUND_ID + uniqueId);
101-
workaroundDiv.innerHTML = svg;
102-
workaroundDiv.className = WORKAROUND_ID; // Make if findable for debugging & testing purposes
103-
}
104-
};
105-
106-
var workAroundWebkitBugIgnoringTheFirstRuleInCSS = function (doc) {
107-
// Works around bug with webkit ignoring the first rule in each style declaration when rendering the SVG to the
108-
// DOM. While this does not directly affect the process when rastering to canvas, this is needed for the
109-
// workaround found in workAroundBrowserBugForBackgroundImages();
110-
if (window.navigator.userAgent.indexOf("WebKit") >= 0) {
111-
asArray(doc.getElementsByTagName("style")).forEach(function (style) {
112-
style.textContent = "span {}\n" + style.textContent;
113-
});
114-
}
115-
};
116-
117-
var cleanUpAfterWorkAroundForBackgroundImages = function (svg, canvas) {
118-
var uniqueId = util.getConstantUniqueIdFor(svg),
119-
doc = canvas ? canvas.ownerDocument : window.document,
120-
div = doc.getElementById(WORKAROUND_ID + uniqueId);
121-
if (div) {
122-
div.parentNode.removeChild(div);
123-
}
124-
};
125-
12657
var zoomedElementSizingAttributes = function (size, zoomFactor) {
12758
var closestScaledWith, closestScaledHeight,
12859
offsetX, offsetY;
@@ -171,7 +102,6 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
171102
module.getSvgForDocument = function (doc, size, zoomFactor) {
172103
var xhtml;
173104

174-
workAroundWebkitBugIgnoringTheFirstRuleInCSS(doc);
175105
xhtml = xmlserializer.serializeToString(doc);
176106

177107
browser.validateXHTML(xhtml);
@@ -193,7 +123,7 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
193123
return {message: "Error rendering page"};
194124
};
195125

196-
module.renderSvg = function (svg, canvas) {
126+
module.renderSvg = function (svg) {
197127
var url, image,
198128
defer = ayepromise.defer(),
199129
resetEventHandlers = function () {
@@ -204,11 +134,8 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
204134
if (url) {
205135
cleanUpUrl(url);
206136
}
207-
cleanUpAfterWorkAroundForBackgroundImages(svg, canvas);
208137
};
209138

210-
workAroundBrowserBugForBackgroundImages(svg, canvas);
211-
212139
url = buildImageUrl(svg);
213140

214141
image = new window.Image();
@@ -267,7 +194,7 @@ var render = (function (util, browser, documentHelper, xmlserializer, ayepromise
267194
return module.getSvgForDocument(doc, size, options.zoom);
268195
})
269196
.then(function (svg) {
270-
return module.renderSvg(svg, canvas);
197+
return module.renderSvg(svg);
271198
});
272199
};
273200

‎test/SpecRunner.html

-1
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,6 @@
3737
<script src="specs/BrowserSpec.js"></script>
3838
<script src="specs/RenderSpec.js"></script>
3939
<script src="specs/MainInterfaceSpec.js"></script>
40-
<script src="specs/WorkaroundSpec.js"></script>
4140
<!-- test specs -->
4241
<script src="specs/diffHelperSpec.js"></script>
4342
</head>

‎test/specs/RenderSpec.js

+1-42
Original file line numberDiff line numberDiff line change
@@ -136,47 +136,6 @@ describe("The rendering process", function () {
136136
expect(function () { render.getSvgForDocument(doc, aRenderSize(), 1); }).toThrow(error);
137137
});
138138

139-
describe("workAroundWebkitBugIgnoringTheFirstRuleInCSS", function () {
140-
var originalUserAgent, myUserAgent;
141-
142-
beforeEach(function () {
143-
originalUserAgent = window.navigator.userAgent;
144-
// Mock userAgent, does not work under Safari
145-
navigator.__defineGetter__('userAgent', function () {
146-
return myUserAgent;
147-
});
148-
});
149-
150-
afterEach(function () {
151-
myUserAgent = originalUserAgent;
152-
});
153-
154-
it("should add a workaround for Webkit to account for first CSS rules being ignored", function () {
155-
var doc = document.implementation.createHTMLDocument(""),
156-
svgCode;
157-
158-
myUserAgent = "WebKit";
159-
testHelper.addStyleToDocument(doc, 'span { background-image: url("data:image/png;base64,soMEfAkebASE64="); }');
160-
161-
svgCode = render.getSvgForDocument(doc, aRenderSize(), 1);
162-
163-
expect(svgCode).toMatch(/<style type="text\/css">\s*span \{\}/);
164-
});
165-
166-
ifNotInWebkitIt("should not add a workaround outside of WebKit", function () {
167-
var doc = document.implementation.createHTMLDocument(""),
168-
svgCode;
169-
170-
myUserAgent = "Something else";
171-
testHelper.addStyleToDocument(doc, 'span { background-image: url("data:image/png;base64,soMEfAkebASE64="); }');
172-
173-
svgCode = render.getSvgForDocument(doc, aRenderSize(), 1);
174-
175-
expect(svgCode).not.toMatch(/span \{\}/);
176-
});
177-
178-
});
179-
180139
it("should work around collapsing margins in Chrome & Safari", function () {
181140
// Bottom margin that would trigger a collapsing margin with the following SVG
182141
var topChild = document.createElement('div');
@@ -337,7 +296,7 @@ describe("The rendering process", function () {
337296
{zoom: 42}
338297
);
339298
expect(render.getSvgForDocument).toHaveBeenCalledWith(doc, calculatedSize, 42);
340-
expect(render.renderSvg).toHaveBeenCalledWith(svg, canvas);
299+
expect(render.renderSvg).toHaveBeenCalledWith(svg);
341300

342301
done();
343302
});

0 commit comments

Comments
 (0)