paper-input breaks tabindex contract

[rslawik]

Description

<paper-input> does not respect tabindex contract.

https://codepen.io/rileybauer/pen/vaeMaQ (by @rileyjbauer) shows that tabIndex property and tabindex attribute can go out of sync. It looks like the tabIndex property is generated by Polymer: https://imgur.com/sSSBMFx.

Expected outcome

The property and the attribute are in sync.

For example:

$0.tabIndex = -1;
$0.getAttribute('tabindex'); // returns -1

and

$0.setAttribute('tabindex', 0);
$0.tabIndex; // returns 0

Actual outcome

Initial value of $0.tabIndex is undefined.

Changing the property does not affect the attribute. For example:

$0.getAttribute('tabindex'); // returns 0
$0.tabIndex = -1;
$0.getAttribute('tabindex'); // returns 0

Live Demo

https://codepen.io/rileybauer/pen/vaeMaQ (by @rileyjbauer)

Steps to reproduce

Steps are explained in the live demo.

Additionally try interacting with <paper-input> directly from the console:

$0.tabIndex; // returns undefined
$0.getAttribute('tabindex'); // returns 0
$0.tabIndex = -1;
$0.getAttribute('tabindex'); // returns 0

Browsers Affected

• [ x ] Chrome
• [ x ] Firefox
• [ x ] Safari 11
• [ ] Safari 9
• [ ] Safari 8
• [ ] Safari 7
• [ ] Edge
• [ ] IE 11
• [ ] IE 10