Skip to content
This repository has been archived by the owner on Dec 19, 2017. It is now read-only.

Polymer reference to image breaks build #152

Closed
DartBot opened this issue Jun 5, 2015 · 19 comments
Closed

Polymer reference to image breaks build #152

DartBot opened this issue Jun 5, 2015 · 19 comments

Comments

@DartBot
Copy link

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="96" height="96"hspace="10"> Issue by zoechi
Originally opened as dart-lang/sdk#17914


What steps will reproduce the problem?
1.
<polymer-ui-iconset id="polymer-ui-icons" src="../packages/polymer_ui_elements/polymer_ui_action_icons/action_icons.png" width="24" iconsize="24"
    icons="drawer menu search dropdown close add trash refresh settings dialoga left right down up grid contact account plus time marker briefcase array columns list modules quilt stream maximize shrink sort shortcut dialog twitter facebook favorite gplus filter tag plusone dots">

  <property theme="polymer-ui-light-theme" offsetx="24"></property>
  <property theme="polymer-ui-dark-theme" offsetx="72"></property>
</polymer-ui-iconset>

(see also https://github.com/ErikGrimes/polymer_ui_elements/blob/master/lib/polymer_ui_icon/polymer_ui_icons.html)

this file is imported to
https://github.com/ErikGrimes/polymer_ui_elements/blob/master/lib/polymer_ui_icon/polymer_ui_icon.html

2.
When I build

[Error from ImportInliner on polymer_ui_elements_examples|web/polymer_ui_menu_item.html]:
package:polymer_ui_elements/polymer_ui_icon/polymer_ui_icons.html:14:1: Invalid url to reach to another package: ../packages/polymer_ui_elements/polymer_ui_action_icons/action_icons.png. Path reaching to other packages must first reach up all the way to the packages folder. For example, try changing the url above to: ../../../packages/polymer_ui_elements/polymer_ui_action_icons/action_icons.png
3.
This works in Dartium but pub build fails with above error message and
no output is generated for entry pages which import polymer-ui-icon.

What is the expected output? What do you see instead?

What version of the product are you using? On what operating system?
Dart VM version: 1.3.0-dev.7.5 (Fri Mar 28 04:58:12 2014) on "linux_x64"
Polymer 0.10.0-pre.5

Please provide any additional information below.
I use another project to build the example pages because transformers had still troubles when I build the examples within this package when I tried recently.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


I tried to use other paths like the one in the error message but that didn't work in Dartium.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2108507?v=3" align="left" width="48" height="48"hspace="10"> Comment by dgrove


Added Area-Polymer, Triaged labels.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/1081711?v=3" align="left" width="48" height="48"hspace="10"> Comment by jmesserly


If you make the change that the error message suggests, does it help? :)

Siggi put those in to explain as best as possible what URIs to use. IIRC, the reason isn't actually ImportInliner, it's more about making sure the package can be consumed by other packages and apps without causing canonicalization errors. Basically, the HTML file and Dart files need to end up resolving to one path regardless of where they're imported from.


cc @sigmundch.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


Using the path in the error message didn't work in Dartium.
I'm actually not sure if I tried pub build with it. I try and post an update.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


Interesting. The path with extra ../../ was intended to work in Dartium too. I'm curious, what does the resolved path look like when the app tries to load that URI? how does it differ from the valid path?

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


It works for imports but not for
src="../packages/polymer_ui_elements/polymer_ui_action_icons/action_icons.png"

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


mmm. Some parts of the system take care of rewriting src urls in 'img' tags, for example, but I'm not sure if we handle this correctly within custom-elements themselves. I'd have to take a closer look.

What's the easiest way to run this? I'm currently trying to checkout polymer_ui_elements and building the 'example' folder (I noticed you are building from another package polymer_ui_elements_example that has a symlink to the examples here, I think now that pub supports building the example folder you shouldn't need that anymore).

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


Ok, I looked a bit more into this.

There are sort of two issues going on:
 * the main issue is indeed that the 'src' attribute you published in polymer_ui_iconset (and similarly in icon) needs special logic to be resolved correctly (from the context where it is defined, to the context where it is instantiated). We need to make it possible to handle URIs in a consistent manner: resolve correctly any URI that is mentioned in an HTML file. Looking at your comments, it seems that you ran into trouble trying to use baseURI before, so there might be other issues that we need to fix to get that resolved (for example issue dart-lang/sdk#17757).

 * the other issue, which is why you are blocked, is that polymer-build is failing with an error. Turns out this only happens in special attributes like 'src', which we assume to be a URL attribute. I think in this case the polymer-build should give a warning and not an error, so pub-build can continue building your app. I just sent out a change to fix that: https://codereview.chromium.org/221673005/.

In the meantime, the fastest way to get unblocked would be to rename 'src' to something else (e.g. 'src2' would do). Then the polymer build process will not try to rewrite it. We'd still need some logic to adjust the URI later, but at least the build process will generate some output code you can run.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


Thanks a lot for taking a look so quick.

I renamed the atribute to src2.
Now I get
Exhausted heap space, trying to allocate 96 bytes.

I don't know if this is related but because of this I can't give feedback about your workaround. I'll update when I have more info.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


I wonder if this is because there are several examples being compiled. When I tried it I listed only that example in the entrypoints (for example:

transformers:

  • polymer:
         entry_points: example/polymer_ui_menu_item/polymer_ui_menu_item.html

) and called 'pub build example'.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


You are right. Now it works. Thanks again!

This was the first time I successfully built an example page inside the polymer-ui-elements library!
One or two weeks ago this still failed and I had to use and additional package just for building the examples. Great improvement!

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


I spoke too soon #­11. Building examples in polymer_elements package worked only for one entry_point. When I add more the build succeeds but the output doesn't work.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


:( - if you haven't already, please file a new bug for the pub folks to know about it.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


This is a known bug https://code.google.com/p/dart/issues/detail?id=15038
I added my comment only to avoid that someone closes the bug because I stated that it already works ;-)

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


I just found out, that this image reference has a deployment issue. When I deploy the build output to a different directory the image can't be loaded

I get the error that the resource couldn't be found at

when I move the image to this path it works.

This isn't an issue with any of the other resources.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/1081711?v=3" align="left" width="48" height="48"hspace="10"> Comment by jmesserly


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

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/405837?v=3" align="left" width="48" height="48"hspace="10"> Comment by zoechi


Is this related to Polymer/old-docs-site#472
I never heard about this logic before. Does Polymer.dart support this?

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


interesting, I haven't heard of this either, I don't believe we have support for it in polymer.dart.


Added this to the 1.6 milestone.
Removed Priority-Unassigned label.
Added Priority-Medium label.

@DartBot
Copy link
Author

DartBot commented Jun 5, 2015

<img src="https://avatars.githubusercontent.com/u/2049220?v=3" align="left" width="48" height="48"hspace="10"> Comment by sigmundch


Removed this from the 1.6 milestone.
Added Polymer-P-1 label.

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

No branches or pull requests

2 participants