dart-archive/polymer_elements

Polymer elements

This package wraps the Polymer project's included js elements, providing the following features:

• Because the elements are bundled into a single pub package, you can add polymer_elements as a dependency in your pubspec. You don't need to install npm or bower.
• The elements are wrapped with Dart proxy classes, making them easier to interact with from Dart apps.

You can find out more about Polymer elements here: https://elements.polymer-project.org/

Using elements

All elements live at the top level of the lib/ folder.

Import into HTML:

<link rel="import" href="packages/polymer_elements/iron_input.html">

Import into Dart:

import 'package:polymer_elements/iron_input.dart';

polymer_elements's Issues

Port the iron-elements tests!

Probably the largest part of #1. This might need to be split into separate tasks.

Port all the tests!

Community involvement on this one would be great, as there are north of 170 elements/behaviors total. To that end, and also for my own sanity, I am separating this out into a bunch of sub-tasks.

The goal is to just port all existing js tests, not to write tests of our own.

• Iron Elements (issue)
• Gold Elements (issue)
• Platinum Elements (issue)
  • Ran into various issues and decided to remove these from the 1.0 roadmap at least for now. See #12 for the issue to add them back.
• Neon Elements (issue)
• Paper Elements (issue)
• Google Web Components (issue)
• Molecules (issue)

paper_textarea.dart fails 'basic input attributes are bound to textarea'

  if (attrsAttr is bool) {
          expect(inputAttr, equals("$attrsAttr"));

Expected: 'true'
    Actual: ''
     Which: is different. Both strings start the same, but the given value is missing the following trailing characters: true

  package:test                    expect
  paper_textarea_test.dart 65:11  main.<async>.<fn>.<fn>

Remove platinum elements, at least for now

paper_input_test.dart fails 'invalid attribute updated after calling validate()'

  type 'bool' is not a subtype of type 'void' of 'function result'.
  package:polymer_elements/paper_input_behavior.dart 171:17  HtmlElement&CustomElementProxyMixin&PolymerProxyMixin&IronFormElementBehavior&PaperInputBehavior.validate

Port iron-request status code tests

Left these out on the original implementation since we would need to mock out the server to spoof status codes. Also its not particularly interesting on the dart side.

Add a way to use `paper-dialog-common.css` without pointing at the `src` folder.

paper-checkbox failing tests

Setting aria-label attribute doesn't override actual value in component.

<paper-checkbox id="check3" aria-label="Batman">Robin</paper-checkbox>

expect(c.getAttribute('aria-label'), equals("Batman"));

is failing

paper_input_error_test.dart fails 'basic error message only appears when input is invalid'

expect(error.getComputedStyle().visibility, equals('hidden'));

  Expected: 'hidden'
    Actual: 'visible'
     Which: is different.
  Expected: hidden
    Actual: visible

Port the molecules tests!

Part of #1.

Port the paper-element tests!

Part of #1. This may need to be split up into multiple sub-tasks.

paper tooltip test is failing

show method is called after tooltip was removed

Port remaining icon sets

There are some additional icon sets in the iron-icons repo.

• av-icons
• communication-icons
• device-icons
• editor-icons
• hardware-icons
• image-icons
• maps-icons
• social-icons
• update-icons

iron-menu-behavior multi select failing tests

Focusing does not seem to work properly in multi mode.

paper_radio_button_basic_test 'button respects the user set aria-label' failing

expect(c.attributes['aria-label'], equals("Batman"));

 Expected: 'Batman'
    Actual: 'Robin'
     Which: is different.
  Expected: Batman
    Actual: Robin
            ^
   Differ at offset 0

  package:test                             expect
  paper_radio_button_basic_test.dart 73:7  main.<async>.<fn>.<fn>

iron-list doesn't work

I tried iron-list but it doesn't render any items.
https://github.com/bwu-dart-playground/polymer1/blob/master/iron_list/web/app_element.html#L19

No idea if you're already interested on bug reports about these elements 😕

Port the Paper behaviors tests!

Part of #13

paper_input_test fails 'a11y has aria-describedby for character counter and error'

expect(input.attributes.containsKey('aria-describedby'), isTrue);

Expected: true
    Actual: <false>

Port the gold-elements tests!

Part of #1.

google-hangout-button test fails in test runner

It passes when you run manually though, so this is lower pri.

Add helper for mocking server responses in tests

Currently the iron-request, iron-ajax, and iron-form tests are actually serving static files instead of using a mock server. This only supports GET requests, and doesn't allow us to modify response headers/etc, so some tests are being skipped.

This might be a bit complicated since all requests are actually coming from the JS side of things. Might be easiest to just provide a wrapper around a JS mocking library?

paper-tooltip test times out on test runner

Do a copyright audit

Failing iron-ajax test, error event not firing

See the skipped test in iron_ajax_test.dart

Port the Neon behaviors tests!

Part of #13

paper_input_error_test.dart fails 'basic error message add on is registered'

  expect(container.jsElement['_addons'].length, equals(1));

Expected: <1>
    Actual: <0>

Port the behaviors tests

• Iron behaviors (issue)
• Neon behaviors (issue) No tests to port
• Paper behaviors (issue)

Port the neon element tests!

Part of #1.

paper_input_test fails 'a11y has aria-describedby for character counter'

expect(input.attributes.containsKey('aria-describedby'), isTrue);

Expected: true
    Actual: <false>

paper tabs test failing

pressing enter on tab is not causing a click

Most tests fail in FF

Related to https://github.com/Polymer/vulcanize/issues/234

paper toggle button tests failing

1) down method is used that seems not to be switching element state
2) all tests are checking aria-checked attribute but examples on main polymer website seems to be modifiying aria-pressed attribute

xp parameter for down helper should be optional

A number of the paper-radio-button tests call the down helper to click the button without the xy parameter. Making it optional and just passing null to the js method doesn't appear to work (the button doesn't get clicked), so creating this issue for now.

paper_icon_button_basic_test 'applies an icon specified by the `icon` attribute' failing

You can use the element in a polymer web app project and see the svg in the dom and query it via a querySelector. The test below, however, fails.

expect(Polymer.dom(b1.$['icon'].jsElement['root']).querySelector('svg'),
          isNotNull);

automated tests in supported browsers

I noticed when working on a web component using the new elements that they don't necessarily work when run in browsers other than Dartium. Chrome and Firefox are better than Safari. Given that the end target is javascript, seems reasonable that these should be tested against other browsers in javascript form.

A reasonable start might be to setup automated tests on drone.io for webkit based browsers and Chrome, but that would leave out IE, Edge and Safari. Browserstack might be a better option. I'm not sure if there's a free for open source option available anywhere.

google-map missing markers property

blocked on GoogleWebComponents/google-map#183

iron-form submit doesn't work

Submitting a form like

 <form is="iron-form" id="form" method="post"  action="http://localhost:4040/person/new">
          <paper-input name="firstName" type="text" label="First" style="display: inline-block;" autofocus></paper-input>
          <paper-button><button>Add</button></paper-button>
      </form>

handling the request on the server like so

 var jsonString = await req.transform(UTF8.decoder).join();
      print(req.headers);
      print(jsonString);

results in

user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.0 (Dart) Safari/537.36
connection: keep-alive
accept: */*
accept-language: en-US,en;q=0.8
accept-encoding: gzip, deflate
origin: http://localhost:63342
content-length: 15
host: localhost:4040
content-type: application/x-www-form-urlencoded
referer: http://localhost:63342/polymer_10_demo/web/index.html

[object Object]

Port the Iron behavior tests!

Part of #13

Port the Google Web Components tests!

Part of #1. It may end up that some apis are hard to use via js-interop, but porting the tests should flush this out. Please note any issues here. This may also need to be split into a few subtasks.

Set up CI tests

Either through package bots or some other solution, package bots may be the easiest though.

Add the platinum-elements, or port them if necessary.

They were removed here 6a08fdf, and tests live here https://github.com/dart-lang/polymer_elements/tree/platinum-tests. There were various issues that need to be investigated to get these to work.

Port paper-dropdown-menu

Port paper-dropdown-menu.

paper submenu tests are failing

iron-fit-behavior tests fail on really small window sizes

The test runner unfortunately runs them in really small windows, so they fail.

First login parameter should be Map

https://github.com/dart-lang/polymer_elements/blob/d086c20f34ef784c746ee35d4e011abced08ad3d/lib/firebase_auth.dart#L102

Here https://github.com/GoogleWebComponents/firebase-element/blob/master/demo/x-login.html#L113 a map (object) with username and password is created and passed to the login method

paper_textarea.dart fails 'basic caret position is preserved'

  expect(ironTextarea.textarea.selectionStart, equals(2));

 Expected: <2>
    Actual: <14>

  package:test                   expect
  paper_textarea_test.dart 42:7  main.<async>.<fn>.<fn>

iron-list failing tests

Some of the tests fail when running pub run test -pdartium, but interestingly not when you run them manually.

Port the platinum element tests!

Part of #1.

Relatively small number of elements, but it needs to be investigated how well these will even work via js interop. Porting the tests should be a good way to do this though :).

golden-elements tests failing

All related to display:none for error component.

paper_radio_button_basic_test click tests are failing

Blocked on #40.