Skip to content
This repository has been archived by the owner on Mar 13, 2018. It is now read-only.

Changing dynamic elements results in strange selected attribute behavior #38

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion test/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@

WCT.loadSuites([
'paper-menu.html',
'paper-submenu.html'
'paper-submenu.html',
'paper-menu-repeat.html',
]);

</script>
Expand Down
68 changes: 68 additions & 0 deletions test/paper-menu-repeat.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
<!doctype html>
<!--
@license
Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->
<html>
<head>

<title>paper-menu with repeat dom template</title>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">

<script src="../../webcomponentsjs/webcomponents-lite.js"></script>

<script src="../../web-component-tester/browser.js"></script>
<script src="../../iron-test-helpers/mock-interactions.js"></script>

<link rel="import" href="../paper-menu.html">

</head>
<body>

<template is="dom-bind" id="menu-test-dom-bind">
<paper-menu id="menu" selected="item 1">
<template is="dom-repeat" items="[[items]]" attr-for-selected="id">
<div id="[[item.name]]">[[item.name]]</div>
</template>
</paper-menu>
</template>

<script>

suite('<paper-menu>', function() {
var menu, domBindTemplate;

setup(function() {
domBindTemplate = document.getElementById('menu-test-dom-bind');
domBindTemplate.items = [{name: 'item 1'}, {name: 'item 2'}, {name: 'item 3'}, {name: 'item 4'}];
menu = domBindTemplate.$.menu;
});

test('supports dynamic items', function(done) {
domBindTemplate.items = [{name: 'item A'}, {name: 'item B'}];
setTimeout(function () {
assert.equal(menu.items.length, 2);
// The value is kept from the previous array of elements
assert.equal(menu.selected, 'item 1');
// Tap the 2nd item
MockInteractions.tap(menu.items[1]);
// The selected value should change
assert.equal(menu.selected, 'item B');
done();
});
});

});

</script>

</body>
</html>