Polymer doesn't recognize inline svg in the HTML file (in pub build) #18484

DartBot · 2014-04-28T15:23:06Z

This issue was originally filed by dvor...@gmail.com

What steps will reproduce the problem?

create the new HTML file in the web directory
write an HTML code inside and include the inline svg element with some usual child elements (like <linearGradient />)
include Polymer into the pubspec.yaml (as a dependency) and into the dart file (as an import)
use Polymer (in the dart script and HTML file)
call run build

What is the expected output? What do you see instead?
Polymer running pub build should recognize and handle with inline svg elements in an usual way (just like HTML elements). But it throws unexpected warnings (see below).

What version of the product are you using? On what operating system?
Dart 1.3.3, Polymer 0.9.5+2, Windows 7
I also use the widget.dart as a dependency from its GitHub repository (version 0.3.0-dev)

Please provide any additional information below.
Pub Build output:
C:\Users\Pavel\Projects\my-project>pub build --trace
find: > bin [: No such file or directory
Loading source assets... (2.5s)
Loading observe transformers... (5.5s)
Loading polymer transformers... (2.4s)
Building pavel_dvorak... (0.5s)
[Warning from polymer (Linter) on widget|lib/components/carousel.html]:
lib/components/carousel.html:16:7: definition for Polymer element with tag name
"swap-widget" not found.
[Warning from polymer (Linter) on pavel_dvorak|web/index.html]:
web/index.html:15:1: Named entity expected. Got none.
[Warning from polymer (Linter) on pavel_dvorak|web/index.html]:
web/index.html:59:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (Linter) on pavel_dvorak|web/index.html]:
web/index.html:74:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (Linter) on pavel_dvorak|web/index.html]:
web/index.html:89:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (InlineCodeExtractor) on pavel_dvorak|web/index.html]:
web/index.html:15:1: Named entity expected. Got none.
[Warning from polymer (InlineCodeExtractor) on pavel_dvorak|web/index.html]:
web/index.html:59:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (InlineCodeExtractor) on pavel_dvorak|web/index.html]:
web/index.html:74:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (InlineCodeExtractor) on pavel_dvorak|web/index.html]:
web/index.html:89:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ImportInliner) on pavel_dvorak|web/index.html]:
web/index.html:15:1: Named entity expected. Got none.
[Warning from polymer (ImportInliner) on pavel_dvorak|web/index.html]:
web/index.html:59:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ImportInliner) on pavel_dvorak|web/index.html]:
web/index.html:74:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ImportInliner) on pavel_dvorak|web/index.html]:
web/index.html:89:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ScriptCompactor) on pavel_dvorak|web/index.html]:
web/index.html:86:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ScriptCompactor) on pavel_dvorak|web/index.html]:
web/index.html:101:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (ScriptCompactor) on pavel_dvorak|web/index.html]:
web/index.html:116:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (PolyfillInjector) on pavel_dvorak|web/index.html]:
web/index.html:86:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (PolyfillInjector) on pavel_dvorak|web/index.html]:
web/index.html:101:1: Unexpected end tag (lineargradient). Ignored.
[Warning from polymer (PolyfillInjector) on pavel_dvorak|web/index.html]:
web/index.html:116:1: Unexpected end tag (lineargradient). Ignored.
[Info from Dart2JS]:
Compiling pavel_dvorak|web/index.dart...

No method named 'hide' in class 'DialogElement'.
heslo.hide();
^^^^^^^^^^^^

103 methods retained for use by dart:mirrors out of 2722 total methods (4%).

Import of 'dart:mirrors'.
import 'dart:mirrors';
^^^^^^^^^^^^^^^^^^^^^^

Import of 'dart:mirrors'.
import 'dart:mirrors' show TypeMirror;
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
[Info from Dart2JS]:
Took 0:00:29.032661 to compile pavel_dvorak|web/index.dart.
[Info from Dart2JS]:
Compiling pavel_dvorak|web/index.html_bootstrap.dart...

No method named 'hide' in class 'DialogElement'.
heslo.hide();
^^^^^^^^^^^^

102 methods retained for use by dart:mirrors out of 2841 total methods (4%).

Import of 'dart:mirrors'.
import 'dart:mirrors';
^^^^^^^^^^^^^^^^^^^^^^

Import of 'dart:mirrors'.
import 'dart:mirrors' show TypeMirror;
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
[Info from Dart2JS]:
Took 0:00:16.017917 to compile pavel_dvorak|web/index.html_bootstrap.dart.
Built 51 files to "build".

C:\Users\Pavel\Downloads\pavel-dvorak>

DartBot · 2014-04-29T06:42:44Z

This comment was originally written by @zoechi

I think you miss the SVG element. see https://code.google.com/p/dart/issues/detail?id=997#c7 for more info

DartBot · 2014-04-29T20:52:56Z

This comment was originally written by dvo...@gmail.com

I've made no change in the SVG element by dart script. It was written as static code, but in the process of building, the static code was processed like Polymer doesn't know the svg elements...

sgjesse · 2014-05-01T13:20:30Z

Added Area-Polymer, Triaged labels.

DartBot · 2014-05-01T14:42:01Z

This comment was originally written by dvor...@gmail.com

And it behaves bad way every time Polymer doesn't know the element (e.g. svg, mathml, custom element not processed by Polymer). Polymer always tries at least to add the closing tag to the element even if that element should not be closed or even if that element should have only the solidus (e.g. <linearGradient /> from svg).

jmesserly · 2014-05-13T23:26:42Z

Hi dvorapa0,

we have full support for parsing HTML with SVG. it uses the exact same parsing algorithm your browser uses. It's all straight from the HTML spec:
http://www.whatwg.org/specs/web-apps/current-work/multipage/the-map-element.html#svg-0

if you can provide more information on what the exact HTML looks like I might be able to assist further.

I'm not sure if this is what you were trying to do, but one thing to keep in mind: while the Custom Elements spec has been updated to include Custom SVG Elements, I don't think all of the implementations (Dartium, Polyfill) support this yet.

Added NeedsInfo label.

dgrove · 2014-05-27T18:10:41Z

dvorapa0 - any updates here?

DartBot · 2014-05-28T18:02:13Z

This comment was originally written by dvo...@gmail.com

Yes, I removed Polymer dependency and rewrited the Polymer content just to classic HTML. Now the pub build command is without issues about svg elements. For me everything done, so feel free to close it if you don't think it is important issue and should be fixed.

jmesserly · 2014-05-31T00:13:10Z

Removed Area-Polymer label.
Added Pkg-Polymer, Area-Pkg labels.

sigmundch · 2014-07-01T20:18:16Z

Added this to the Later milestone.
Removed Priority-Unassigned label.
Added Priority-Low label.

sigmundch · 2014-07-08T01:54:29Z

Added Polymer-P-2 label.

sigmundch · 2014-07-08T01:55:12Z

Removed this from the Later milestone.

sigmundch · 2014-07-09T00:09:22Z

Removed Polymer-P-2 label.
Added Polymer-Milestone-Later label.

sigmundch · 2014-07-09T00:11:42Z

Removed Polymer-Milestone-Later label.
Added PolymerMilestone-Later label.

DartBot · 2014-10-01T12:25:12Z

This comment was originally written by aleskv...@mailinator.com

In a month I'll test it again if it throws still that errors in the newest SDK version with newest deps. I'll update this bug or create a new after that

DartBot · 2014-12-09T00:06:45Z

This comment was originally written by briangepper...@briangeppert.com

I'm also having trouble with the Polymer transformer inserting closing tags for void elements like SVG's <linearGradient />. I've tried editing the transformer to fix the issue, but changing it in the packages directory doesn't seem to have any effect. I'm editing the copy in the /packages/ directory (which is, via junction points, the same one as in the pub cache). Am I missing something?

DartBot · 2014-12-09T05:23:02Z

This comment was originally written by @zoechi

According to #14 this issue is solved. #5 asks for more details which weren't provided. Can you please provide more details about your HTML/SVG.

DartBot · 2014-12-09T11:16:19Z

This comment was originally written by aleskv...@mailinator.com

Well, finally I made my project completely without Polymer, so I cannot test it again. But if briangep... has got his own demo with <tag />'s, let's share details with us...

DartBot · 2015-04-18T15:24:48Z

This comment was originally written by dvorapa1...@gmail.com

It looks the author already solved the problem, this could be closed...

jakemac53 · 2015-04-20T15:52:29Z

I think this is stale, at least a really simple svg test works for me without any errors/warnings.

Added AssumedStale label.

DartBot · 2015-06-05T23:05:20Z

This issue has been moved to dart-archive/polymer-dart#172.

dam0vm3nt · 2015-06-12T16:46:03Z

I think this issue is not closed. I've just made (dart 10.0.1 + polymer 16.3+3) a polymer component with an svg inside and I have warnings:

<polymer-element name="svg-element-editor">
    <template>
    <style>

        :host {
            position: relative;
        }

        /**
                       Gradient definitions need to be registered
                       on dart side (can't figure out why for now, just live with it)
                   **/

        .node_red {
            stroke: black;
            fill: url("#gradred")
        }

        .node_green {
            stroke: black;
            fill: url("#gradgreen")
        }
    </style>
    <div layout horizontal fit>
        <svg flex id="myStage">
            <!--

            Polymer will throw stupid warning if we put this here,
            we have to do it programmatically (sigh) from dart



            <defs>
                <lineargradient x1="0" y1="0" x2="0" y2="100%" id="gradred2">
                    <stop offset="0%" stop-color="orange" stop-opacity="1"></stop>
                    <stop offset="100%" stop-color="orange" stop-opacity="0"></stop>
                </lineargradient>
            </defs>
            -->
        </svg>
    </div>
 </template>
</polymer-element>

sigmundch · 2015-06-12T18:07:28Z

correct - this is just tracked in dart-archive/polymer-dart#172 - the closed status here is just to avoid duplication and make sure we only track this in one place.

Cheers!

sigmundch · 2015-06-12T18:09:46Z

never mind - I just noticed that it indeed had the closed status there. Thanks for filing it again.

dam0vm3nt · 2015-06-13T16:11:53Z

You are welcome. Thank you for the good work!

Il giorno ven 12 giu 2015 20:09 sigmundch notifications@github.com ha
scritto:

never mind - I just noticed that it indeed had the closed status there.
Thanks for filing it again.

—
Reply to this email directly or view it on GitHub
#18484 (comment).

DartBot added Type-Defect area-pkg Used for miscellaneous pkg/ packages not associated with specific area- teams. P3 A lower priority bug or feature request closed-obsolete Closed as the reported issue is no longer relevant labels Apr 20, 2015

DartBot mentioned this issue Jun 5, 2015

Polymer doesn't recognize inline svg in the HTML file (in pub build) dart-archive/polymer-dart#172

Closed

This issue was closed.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Polymer doesn't recognize inline svg in the HTML file (in pub build) #18484

Polymer doesn't recognize inline svg in the HTML file (in pub build) #18484

DartBot commented Apr 28, 2014

DartBot commented Apr 29, 2014

DartBot commented Apr 29, 2014

sgjesse commented May 1, 2014

DartBot commented May 1, 2014

jmesserly commented May 13, 2014

dgrove commented May 27, 2014

DartBot commented May 28, 2014

jmesserly commented May 31, 2014

sigmundch commented Jul 1, 2014

sigmundch commented Jul 8, 2014

sigmundch commented Jul 8, 2014

sigmundch commented Jul 9, 2014

sigmundch commented Jul 9, 2014

DartBot commented Oct 1, 2014

DartBot commented Dec 9, 2014

DartBot commented Dec 9, 2014

DartBot commented Dec 9, 2014

DartBot commented Apr 18, 2015

jakemac53 commented Apr 20, 2015

DartBot commented Jun 5, 2015

dam0vm3nt commented Jun 12, 2015

sigmundch commented Jun 12, 2015

sigmundch commented Jun 12, 2015

dam0vm3nt commented Jun 13, 2015

Polymer doesn't recognize inline svg in the HTML file (in pub build) #18484

Polymer doesn't recognize inline svg in the HTML file (in pub build) #18484

Comments

DartBot commented Apr 28, 2014

DartBot commented Apr 29, 2014

DartBot commented Apr 29, 2014

sgjesse commented May 1, 2014

DartBot commented May 1, 2014

jmesserly commented May 13, 2014

dgrove commented May 27, 2014

DartBot commented May 28, 2014

jmesserly commented May 31, 2014

sigmundch commented Jul 1, 2014

sigmundch commented Jul 8, 2014

sigmundch commented Jul 8, 2014

sigmundch commented Jul 9, 2014

sigmundch commented Jul 9, 2014

DartBot commented Oct 1, 2014

DartBot commented Dec 9, 2014

DartBot commented Dec 9, 2014

DartBot commented Dec 9, 2014

DartBot commented Apr 18, 2015

jakemac53 commented Apr 20, 2015

DartBot commented Jun 5, 2015

dam0vm3nt commented Jun 12, 2015

sigmundch commented Jun 12, 2015

sigmundch commented Jun 12, 2015

dam0vm3nt commented Jun 13, 2015