Skip to content
This repository has been archived by the owner on Jun 25, 2020. It is now read-only.

include compound CSS selectors and those that don't mention the <svg> element #23

Open
wants to merge 7 commits into
base: gh-pages
Choose a base branch
from

Conversation

sweetleon
Copy link

I think this solves the issues you pointed out in my last pull request.

Thanks again for this excellent software!

sweetleon and others added 7 commits January 9, 2015 17:25
for example, "html body svg text {...}" becomes just "text {...}" so that it matches once the document is just the contents of the <svg>
e.g., `div, span {...}`
checking image.complete is required for some images
Safari blew up on `input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button`
'xlink:href' seems right, but doesn't work whereas 'href' works

tested on Chrome, Safari, FF and IE10
@sweetleon
Copy link
Author

More fixes have come up as I've been integrating this excellent library into our app. One fix was for an issue with Safari, another for inlined/cached images (which don't trigger onLoad) and one about xlink:href which puzzles me but is required and works on all browsers.

@exupero
Copy link
Owner

exupero commented Jan 19, 2015

At a glance, these changes look good, but I haven't yet had a chance to put together test scenarios to prevent regressions.

  • For the inlined/cached images problem, when you say "inlined" do you mean images that are specified via data URIs?
  • How did you discover and test the href versus xlink:href problem?

Thanks for the changes, as well as the cross-browser testing!

@sweetleon
Copy link
Author

sweetleon commented Jan 20, 2015

Sorry, I should've been clearer.

  1. Yes, inlined images are those that start: data:image/{png,jpg,gif,svg+xml,...};base64,...
  2. I had an inlined image in my SVG and using xlink:href wouldn't render it

LMK if you want me to help put together tests. I generally do lots of TDD.

@exupero
Copy link
Owner

exupero commented Jan 23, 2015

The tests for this library are in index.html, which creates a number of small test scenarios. You can see it here. In each pair of images, the one on the left is an SVG and the one on the right is the image produced by svgAsDataUri, which is generally sufficient to see that the code is working. In most of the pairs, if the images don't match, something is broken. The exceptions are the tests "At a higher resolution" and "Exporting a group within an SVG". If you're not sure what one of rendered images should look like, compare it to how it looks at http://exupero.org/saveSvgAsPng/.

Before you start in, merge in the latest from the gh-pages branch. There are some updates that conflict with the code in this pull request. Some are changes for a feature request in #20. Others are changes I made based on this pull request, specifically handling CSS selector errors in Safari and including @font-face directives, but implemented with slight differences.

If you're not able to figure out the test file (it's a snowflake, I know), put together example scenarios demonstrating the problems or features, and I'll figure out how to integrate them into the tests.

Thanks again for your effort on this, and sorry I've been so slow in responding.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants