Comments (10)
I am also facing the same issue.getting below error in chrome
Error: Failed to execute 'querySelectorAll' on 'Element': '[ng:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-animate)' is not a valid selector.
in FF getting this error
[Exception... "The operation is insecure." code: "18" nsresult: "0x80530012 (SecurityError)" location: ""]
http://localhost:8000/bower_components/angular/angular.js
Line 9383
from savesvgaspng.
Disclaimer: I'm not an active saveSvgAsPng developer, just a user ;)
One possible solution would be to catch the exception and skip that CSS rule. So in saveSvgAsPng.js
(currently @ line 46) change
var elems = dom.querySelectorAll(rule.selectorText);
if (elems.length > 0) {
used += rule.selectorText + " { " + rule.style.cssText + " }\n";
}
to
try {
var elems = dom.querySelectorAll(rule.selectorText);
if (elems.length > 0) {
used += rule.selectorText + " { " + rule.style.cssText + " }\n";
}
} catch(e) {
//console.error(e);
continue;
}
However, this means that any invalid CSS rules obviously won't be applied to the SVG that will ultimately become your PNG.
One may want to log the SyntaxError
exception upon catching (or try to remove AngularJS specific rules?).
from savesvgaspng.
The code in question is filtering out unused CSS rules. I don't think there's a strong reason to do this, so I've removed it, which removes the usage of Element.querySelectorAll
that errors when namespaced attribute names are part of the CSS selector.
from savesvgaspng.
This issue has resurfaced since I've re-added CSS rule filtering.
Unfortunately, I haven't been able to reproduce this error. I've added a CSS rule using the problem selector, but it appears invalid selectors like [ng:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-animate)
are omitted from cssRules
.
I'd appreciate any tips on how to see this error for myself.
from savesvgaspng.
6dc272f adds handling for invalid selector errors.
from savesvgaspng.
I'm seeing a similar error
Invalid CSS selector "svg:svg" DOMException: Failed to execute 'querySelector' on 'Element': 'svg:svg' is not a valid selector.
at saveSvgAsPng.js:68
on a rule in jquery.svg.package-1.5.0/jquery.svg.css
from savesvgaspng.
Make sure you're using the latest code. That error wouldn't be thrown on line 68 of the latest version.
from savesvgaspng.
I thought the update had fixed it, but apparently I just failed to see the message... now it occurs on line 96, apparently while processing this rule.
from savesvgaspng.
I'm having trouble reproducing the error your describe. Can you supply an example failure via JSBin or JSFiddle?
from savesvgaspng.
I've attempted that (JSBin will download an image when opened), but I don't see the error there either. It occurs in our app when trying to save an svg from within an iframe of a wysihtml5 document to which we programmatically copy all stylesheets from the containing page. It turns out we don't actually use the jQuery SVG plugin that has the stylesheet that triggers the error, so the solution for us is to just not load that stylesheet.
from savesvgaspng.
Related Issues (20)
- when <svg> has <img>,con't show the imge in the png HOT 3
- Size of downloaded image varying according to the zoom level of browser HOT 1
- Only half of the SVG is rendered
- saveSvgAsPng without css styleSheets, modifyCss dosen`t work, who can tell me how to use modifyCss HOT 3
- saveSvgAsPng makes svg's image fill disappear (d3.js) HOT 9
- use to generate PNG on server? (solved: using sharp.js instead) HOT 2
- CSS rule breaks export? HOT 3
- i get this error ReferenceError: excludeUnusedCss is not defined HOT 1
- How to add a Google Font? HOT 3
- Uncaught (in promise) TypeError: Cannot read property 'width' of undefined at saveSvgAsPng.js:265 HOT 1
- ReferenceError: navigator is not defined (using Node.js) HOT 1
- How to use fonts in options parameter. HOT 3
- saveSvgAsPng is not capturing all the items inside svg tag
- HOW can i do, if the dataURl size > 2M
- some svgs not working on mobile safari
- Syntax error HOT 1
- svgAsPngUri working on browser but not android HOT 1
- Add/Update TypeScript type definitions
- HTMLElement or SVGElement in Chrome HOT 1
- problem with Canvg library
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from savesvgaspng.