Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(5010)

Unified Diff: chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js

Issue 2885723002: [MD Bookmarks] Add keyboard navigation and selection to bookmark list. (Closed)
Patch Set: address comments Created 3 years, 7 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js
diff --git a/chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js b/chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js
index e1ca42ba51debdcd329abdd9d82ae7daf5e608c2..27072b0c9b5056dbf9a4f137ebe821dc13d36eb4 100644
--- a/chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js
+++ b/chrome/test/data/webui/md_bookmarks/md_bookmarks_focus_test.js
@@ -180,5 +180,171 @@ TEST_F('MaterialBookmarksFocusTest', 'All', function() {
});
});
+ suite('<bookmarks-list>', function() {
+ var list;
+ var store;
+ var items;
+ var multiKey = cr.isMac ? 'meta' : 'ctrl';
+
+ function keydown(item, key, modifiers) {
+ MockInteractions.keyDownOn(item, '', modifiers, key);
+ }
+
+ setup(function() {
+ store = new bookmarks.TestStore({
+ nodes: testTree(createFolder(
+ '1',
+ [
+ createItem('2'),
+ createItem('3'),
+ createItem('4'),
+ createItem('5'),
+ createItem('6'),
+ createFolder('7', []),
+ ])),
+ selectedFolder: '1',
+ });
+ store.setReducersEnabled(true);
+ bookmarks.Store.instance_ = store;
+
+ list = document.createElement('bookmarks-list');
+ list.style.height = '100%';
+ list.style.width = '100%';
+ list.style.position = 'absolute';
+ replaceBody(list);
+ Polymer.dom.flush();
+ items = list.root.querySelectorAll('bookmarks-item');
+ });
+
+ test('simple keyboard selection', function() {
+ var focusedItem = items[0];
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertEquals(
+ '0', focusedItem.$$('.more-vert-button').getAttribute('tabindex'));
+ focusedItem.focus();
+
+ keydown(focusedItem, 'ArrowDown');
+ focusedItem = items[1];
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertEquals(
+ '0', focusedItem.$$('.more-vert-button').getAttribute('tabindex'));
+ assertDeepEquals(['3'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowUp');
+ focusedItem = items[0];
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'End');
+ focusedItem = items[5];
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertDeepEquals(['7'], normalizeSet(store.data.selection.items));
+
+ // Moving past the end of the list is a no-op.
+ keydown(focusedItem, 'ArrowDown');
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertDeepEquals(['7'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'Home');
+ focusedItem = items[0];
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ // Moving past the start of the list is a no-op.
+ keydown(focusedItem, 'ArrowUp');
+ assertEquals('0', focusedItem.getAttribute('tabindex'));
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'Escape');
+ assertDeepEquals([], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'a', 'ctrl');
+ assertDeepEquals(
+ ['2', '3', '4', '5', '6', '7'],
+ normalizeSet(store.data.selection.items));
+ });
+
+ test('shift selection', function() {
+ // TODO(calamity): Make the first item the anchor index when a new folder
+ // is selected.
+ var focusedItem = items[0];
+ focusedItem.focus();
+
+ keydown(focusedItem, 'ArrowDown');
+ focusedItem = items[1];
+ assertDeepEquals(['3'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowUp', 'shift');
+ focusedItem = items[0];
+ assertDeepEquals(['2', '3'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', 'shift');
+ focusedItem = items[1];
+ assertDeepEquals(['3'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', 'shift');
+ focusedItem = items[2];
+ assertDeepEquals(['3', '4'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'End', 'shift');
+ focusedItem = items[2];
+ assertDeepEquals(
+ ['3', '4', '5', '6', '7'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'Home', 'shift');
+ focusedItem = items[2];
+ assertDeepEquals(['2', '3'], normalizeSet(store.data.selection.items));
+ });
+
+ test('ctrl selection', function() {
+ var focusedItem = items[0];
+ focusedItem.focus();
+
+ keydown(focusedItem, ' ', 'ctrl');
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', 'ctrl');
+ focusedItem = items[1];
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+ assertEquals('3', store.data.selection.anchor);
+
+ keydown(focusedItem, 'ArrowDown', 'ctrl');
+ focusedItem = items[2];
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, ' ', 'ctrl');
+ assertDeepEquals(['2', '4'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, ' ', 'ctrl');
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+ });
+
+ test('ctrl+shift selection', function() {
+ var focusedItem = items[0];
+ focusedItem.focus();
+
+ keydown(focusedItem, ' ', 'ctrl');
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', 'ctrl');
+ focusedItem = items[1];
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', 'ctrl');
+ focusedItem = items[2];
+ assertDeepEquals(['2'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', ['ctrl', 'shift']);
+ focusedItem = items[3];
+ assertDeepEquals(
+ ['2', '4', '5'], normalizeSet(store.data.selection.items));
+
+ keydown(focusedItem, 'ArrowDown', ['ctrl', 'shift']);
+ focusedItem = items[3];
+ assertDeepEquals(
+ ['2', '4', '5', '6'], normalizeSet(store.data.selection.items));
+ });
+ });
+
mocha.run();
});
« no previous file with comments | « chrome/test/data/webui/md_bookmarks/item_test.js ('k') | chrome/test/data/webui/md_bookmarks/reducers_test.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698