| 1 |
www |
1 |
"use strict";
|
|
|
2 |
|
|
|
3 |
describe("dropdown shortcuts: init plugin (with nationalMode=false) to test keyboard shortcuts", function() {
|
|
|
4 |
|
|
|
5 |
beforeEach(function() {
|
|
|
6 |
intlSetup();
|
|
|
7 |
input = $("<input>").appendTo("body");
|
|
|
8 |
iti = window.intlTelInput(input[0], {
|
|
|
9 |
nationalMode: false
|
|
|
10 |
});
|
|
|
11 |
});
|
|
|
12 |
|
|
|
13 |
afterEach(function() {
|
|
|
14 |
intlTeardown();
|
|
|
15 |
});
|
|
|
16 |
|
|
|
17 |
|
|
|
18 |
|
|
|
19 |
describe("when selected flag element has focus", function() {
|
|
|
20 |
|
|
|
21 |
beforeEach(function() {
|
|
|
22 |
getFlagsContainerElement().focus();
|
|
|
23 |
});
|
|
|
24 |
|
|
|
25 |
it("pressing UP opens the dropdown", function() {
|
|
|
26 |
triggerKeyOnFlagsContainerElement("ArrowUp");
|
|
|
27 |
expect(getListElement()).toBeVisible();
|
|
|
28 |
});
|
|
|
29 |
|
|
|
30 |
it("pressing DOWN opens the dropdown", function() {
|
|
|
31 |
triggerKeyOnFlagsContainerElement("ArrowDown");
|
|
|
32 |
expect(getListElement()).toBeVisible();
|
|
|
33 |
});
|
|
|
34 |
|
|
|
35 |
it("pressing SPACE opens the dropdown", function() {
|
|
|
36 |
triggerKeyOnFlagsContainerElement(" ");
|
|
|
37 |
expect(getListElement()).toBeVisible();
|
|
|
38 |
});
|
|
|
39 |
|
|
|
40 |
it("pressing ENTER opens the dropdown", function() {
|
|
|
41 |
triggerKeyOnFlagsContainerElement("Enter");
|
|
|
42 |
expect(getListElement()).toBeVisible();
|
|
|
43 |
});
|
|
|
44 |
|
|
|
45 |
});
|
|
|
46 |
|
|
|
47 |
|
|
|
48 |
|
|
|
49 |
describe("when dropdown is opened", function() {
|
|
|
50 |
|
|
|
51 |
beforeEach(function() {
|
|
|
52 |
getSelectedFlagContainer()[0].click();
|
|
|
53 |
});
|
|
|
54 |
|
|
|
55 |
it("pressing esc closes the popup", function() {
|
|
|
56 |
triggerKeyOnBody("Escape");
|
|
|
57 |
expect(getListElement()).not.toBeVisible();
|
|
|
58 |
});
|
|
|
59 |
|
|
|
60 |
it("pressing up while on the top item does not change the highlighted item", function() {
|
|
|
61 |
triggerKeyOnBody("ArrowUp");
|
|
|
62 |
var topItem = getListElement().find("li.iti__country:eq(0)");
|
|
|
63 |
expect(topItem).toHaveClass("iti__highlight");
|
|
|
64 |
});
|
|
|
65 |
|
|
|
66 |
it("pressing z highlights Zambia", function() {
|
|
|
67 |
triggerKeyOnBody("z");
|
|
|
68 |
var zambiaListItem = getListElement().find("li[data-country-code='zm']");
|
|
|
69 |
expect(zambiaListItem).toHaveClass("iti__highlight");
|
|
|
70 |
});
|
|
|
71 |
|
|
|
72 |
it("pressing z three times also highlights Zambia (no further matches)", function() {
|
|
|
73 |
triggerKeyOnBody("z");
|
|
|
74 |
triggerKeyOnBody("z");
|
|
|
75 |
triggerKeyOnBody("z");
|
|
|
76 |
var zambiaListItem = getListElement().find("li[data-country-code='zm']");
|
|
|
77 |
expect(zambiaListItem).toHaveClass("iti__highlight");
|
|
|
78 |
});
|
|
|
79 |
|
|
|
80 |
|
|
|
81 |
|
|
|
82 |
describe("typing z then i then DOWN", function() {
|
|
|
83 |
|
|
|
84 |
var lastItem;
|
|
|
85 |
|
|
|
86 |
beforeEach(function() {
|
|
|
87 |
lastItem = getListElement().find("li.iti__country:last");
|
|
|
88 |
triggerKeyOnBody("z");
|
|
|
89 |
triggerKeyOnBody("i");
|
|
|
90 |
triggerKeyOnBody("ArrowDown");
|
|
|
91 |
});
|
|
|
92 |
|
|
|
93 |
it("highlights the last item, which is Åland Islands", function() {
|
|
|
94 |
expect(lastItem).toHaveClass("iti__highlight");
|
|
|
95 |
expect(lastItem.attr("data-country-code")).toEqual("ax");
|
|
|
96 |
});
|
|
|
97 |
|
|
|
98 |
it("pressing down while on the last item does not change the highlighted item", function() {
|
|
|
99 |
triggerKeyOnBody("ArrowDown");
|
|
|
100 |
expect(lastItem).toHaveClass("iti__highlight");
|
|
|
101 |
});
|
|
|
102 |
});
|
|
|
103 |
|
|
|
104 |
|
|
|
105 |
|
|
|
106 |
describe("pressing down", function() {
|
|
|
107 |
|
|
|
108 |
beforeEach(function() {
|
|
|
109 |
triggerKeyOnBody("ArrowDown");
|
|
|
110 |
});
|
|
|
111 |
|
|
|
112 |
it("changes the highlighted item", function() {
|
|
|
113 |
var listElement = getListElement();
|
|
|
114 |
var topItem = listElement.find("li.iti__country:eq(0)");
|
|
|
115 |
expect(topItem).not.toHaveClass("iti__highlight");
|
|
|
116 |
var secondItem = listElement.find("li.iti__country:eq(1)");
|
|
|
117 |
expect(secondItem).toHaveClass("iti__highlight");
|
|
|
118 |
});
|
|
|
119 |
|
|
|
120 |
|
|
|
121 |
|
|
|
122 |
describe("pressing enter", function() {
|
|
|
123 |
|
|
|
124 |
beforeEach(function() {
|
|
|
125 |
triggerKeyOnBody("Enter");
|
|
|
126 |
});
|
|
|
127 |
|
|
|
128 |
it("changes the active item", function() {
|
|
|
129 |
var listElement = getListElement();
|
|
|
130 |
var topItem = listElement.find("li.iti__country:eq(0)");
|
|
|
131 |
expect(topItem).not.toHaveClass("iti__active");
|
|
|
132 |
var secondItem = listElement.find("li.iti__country:eq(1)");
|
|
|
133 |
expect(secondItem).toHaveClass("iti__active");
|
|
|
134 |
});
|
|
|
135 |
|
|
|
136 |
it("closes the dropdown", function() {
|
|
|
137 |
expect(getListElement()).not.toBeVisible();
|
|
|
138 |
});
|
|
|
139 |
|
|
|
140 |
it("updates the dial code", function() {
|
|
|
141 |
expect(getInputVal()).toEqual("+44");
|
|
|
142 |
});
|
|
|
143 |
|
|
|
144 |
});
|
|
|
145 |
|
|
|
146 |
});
|
|
|
147 |
});
|
|
|
148 |
|
|
|
149 |
});
|