laurentj / slimerjs

A scriptable browser like PhantomJS, based on Firefox
http://slimerjs.org
Other
3k stars 259 forks source link

rendering svg file with local images results in a empty image box #298

Closed e-tip closed 9 years ago

e-tip commented 9 years ago

Hi all, i've a slimerjs script that renders an svg to jpg, the problem i'm facing is that everything is ok if i use like href="http://www.test.it/test.jpg" while if i download the image to te local machine and replace http with file:///local/path/test.jpg the file results in no image rendered

laurentj commented 9 years ago

duplicate of #255

e-tip commented 9 years ago

Sorry for my late reply. I don't think that my bug is a duplicate of #255 because that bug talks to open a local html file instead i'm trying to open a local svg file ( that i managed to... ) with this structure

<svg viewBox="0 0 631.5 305" data-spread="cover" class="loading" data-type="canvas" xmlns:xlink="http://www.w3.org/1999/xlink" id="artboard" xmlns="http://www.w3.org/2000/svg" width="631.5mm" version="1.1" height="305mm">
    <desc>Created with Raphaël 2.1.0</desc>
    <defs>
        <clipPath id="mask_artboard_4" data-type="mask" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0)">
            <rect height="325" width="633.5" y="-162.5" x="-316.75" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0)"></rect>
        </clipPath>
        <filter enable-background="accumulate" height="300%" width="300%" y="-150%" x="-150%" color-interpolation-filters="sRGB" id="artboard_FUID_13">
            <feComponentTransfer result="transformed" in="SourceGraphic">
                <feFuncR tableValues="0.8509803921568627 1" type="table"></feFuncR>
                <feFuncG tableValues="0.7411764705882353 1" type="table"></feFuncG>
                <feFuncB tableValues="0.6549019607843137 1" type="table"></feFuncB>
            </feComponentTransfer>
            <feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" color-interpolation-filters="sRGB" result="transformed" type="matrix" in="transformed"></feColorMatrix>
            <feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" result="transformed" type="matrix" in="transformed"></feColorMatrix>
            <feColorMatrix values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" result="transformed" type="matrix" in="transformed"></feColorMatrix>
            <feColorMatrix values="0" type="hueRotate" in="transformed"></feColorMatrix>
            <feGaussianBlur stdDeviation="1.5" result="blur" in="SourceAlpha"></feGaussianBlur>
            <feOffset dy="3" dx="3" result="shadow" in="blur"></feOffset>
            <feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0" type="matrix" result="cloredShadow" in="shadow"></feColorMatrix>
            <feMerge>
                <feMergeNode mode="normal" in="cloredShadow"></feMergeNode>
                <feMergeNode mode="normal" in="transformed"></feMergeNode>
            </feMerge>
        </filter>

    </defs>
    <g>
        <g y="152.5" x="315.75" transform="translate(315.75,152.5)" style="display: block;" data-type="background-fullpage">
            <g style="clip-path: url(#mask_artboard_4);">
                <rect fill-opacity="0" transform="matrix(1,0,0,1,0,0)" style="fill-opacity: 0;" class="drawing-box" stroke-opacity="1" stroke-width="0" stroke="transparent" fill="#f0eff5" ry="0" rx="0" r="0" height="325.000000000001" width="637.5" y="-162.5000000000005" x="-318.75"></rect>
                <image transform="scale(1,1)" filter="url('#artboard_FUID_13')" style="opacity: 1;" xlink:href="http://babybook-eu.graphistudio.com/designer/images/media2/Sample17/Sample17_D_1/trame01-14-display.png" preserveAspectRatio="none meet" height="320.077830188679" width="734.5" y="-160.03891509434" x="-367.25"></image>
            </g>
        </g>
    </g>
</svg>

This works instead if i change the

    xlink:href="http://my.awesome.website.com/trame01-14-display.png

to

    xlink:href="file:///var/www/images/trame01-14-display.png

i get a blank image

laurentj commented 9 years ago

It is the same issue : SlimerJS has a bug to open "file://" files. No matter if it is an html file or a svg file or any other file type.