1
1
const eventHandlers = require ( "./eventHandlers.js" ) ;
2
2
3
3
describe ( "Checks that event listeners are called appropriately" , ( ) => {
4
- test ( "Test modal lesson close click event" , ( ) => {
5
- document . body . innerHTML = `
4
+ test ( "Test modal lesson close click event" , ( ) => {
5
+ document . body . innerHTML = `
6
6
<button class="modal-lesson-close button">
7
7
<img alt="remove lesson icon" src="./images/cancel-white.svg" />
8
8
</button>
9
9
` ;
10
- const modalLessonClose = document . querySelector ( ".modal-lesson-close" ) ;
10
+ const modalLessonClose = document . querySelector ( ".modal-lesson-close" ) ;
11
11
12
- eventHandlers . handleCloseLessonModal = jest . fn ( ( ) => { } ) ;
13
- modalLessonClose . addEventListener (
14
- "click" ,
15
- eventHandlers . handleCloseLessonModal
16
- ) ;
12
+ eventHandlers . handleCloseLessonModal = jest . fn ( ( ) => { } ) ;
13
+ modalLessonClose . addEventListener (
14
+ "click" ,
15
+ eventHandlers . handleCloseLessonModal
16
+ ) ;
17
17
18
- modalLessonClose . click ( ) ;
19
- expect ( eventHandlers . handleCloseLessonModal ) . toBeCalled ( ) ;
20
- } ) ;
18
+ modalLessonClose . click ( ) ;
19
+ expect ( eventHandlers . handleCloseLessonModal ) . toBeCalled ( ) ;
20
+ } ) ;
21
21
22
- test ( "Test overlay lesson close click event" , ( ) => {
23
- document . body . innerHTML = `
22
+ test ( "Test overlay lesson close click event" , ( ) => {
23
+ document . body . innerHTML = `
24
24
<div class="overlay"></div>
25
25
` ;
26
- const overlay = document . querySelector ( ".overlay" ) ;
26
+ const overlay = document . querySelector ( ".overlay" ) ;
27
27
28
- overlay . click ( ) ;
29
- expect ( eventHandlers . handleCloseLessonModal ) . toBeCalled ( ) ;
30
- } ) ;
28
+ overlay . click ( ) ;
29
+ expect ( eventHandlers . handleCloseLessonModal ) . toBeCalled ( ) ;
30
+ } ) ;
31
31
32
- test ( "Test lesson close escape keypress event" , ( ) => {
33
- eventHandlers . handleEscapeLessonModal = jest . fn ( ( ) => { } ) ;
34
- document . addEventListener ( "keydown" , eventHandlers . handleEscapeLessonModal ) ;
32
+ test ( "Test lesson close escape keypress event" , ( ) => {
33
+ eventHandlers . handleEscapeLessonModal = jest . fn ( ( ) => { } ) ;
34
+ document . addEventListener ( "keydown" , eventHandlers . handleEscapeLessonModal ) ;
35
35
36
- const event = new KeyboardEvent ( "keydown" , { keyCode : 27 , which : 27 } ) ;
37
- document . dispatchEvent ( event ) ;
36
+ const event = new KeyboardEvent ( "keydown" , { keyCode : 27 , which : 27 } ) ;
37
+ document . dispatchEvent ( event ) ;
38
38
39
- expect ( eventHandlers . handleEscapeLessonModal ) . toBeCalled ( ) ;
40
- } ) ;
39
+ expect ( eventHandlers . handleEscapeLessonModal ) . toBeCalled ( ) ;
40
+ } ) ;
41
41
42
- test ( "Test clear button click event" , ( ) => {
43
- document . body . innerHTML = `
42
+ test ( "Test clear button click event" , ( ) => {
43
+ document . body . innerHTML = `
44
44
<button class="create-lesson-clear button" hidden>Clear</button>
45
45
` ;
46
- const clearBtn = document . querySelector ( ".create-lesson-clear" ) ;
47
- eventHandlers . handleClear = jest . fn ( ( ) => { } ) ;
48
- clearBtn . addEventListener ( "click" , eventHandlers . handleClear ) ;
46
+ const clearBtn = document . querySelector ( ".create-lesson-clear" ) ;
47
+ eventHandlers . handleClear = jest . fn ( ( ) => { } ) ;
48
+ clearBtn . addEventListener ( "click" , eventHandlers . handleClear ) ;
49
49
50
- clearBtn . click ( ) ;
51
- expect ( eventHandlers . handleClear ) . toBeCalled ( ) ;
52
- } ) ;
50
+ clearBtn . click ( ) ;
51
+ expect ( eventHandlers . handleClear ) . toBeCalled ( ) ;
52
+ } ) ;
53
53
54
- test ( "Test form clear button" , ( ) => {
55
- document . body . innerHTML = `
54
+ test ( "Test form clear button" , ( ) => {
55
+ document . body . innerHTML = `
56
56
<form>
57
57
<div class="create-lesson-title-container">
58
58
<input
@@ -79,18 +79,18 @@ describe("Checks that event listeners are called appropriately", () => {
79
79
</button>
80
80
</form>
81
81
` ;
82
- const formElement = document . querySelector ( "form" ) ;
83
- eventHandlers . handleClearBtn = jest . fn ( ( ) => { } ) ;
84
- formElement . addEventListener ( "keyup" , eventHandlers . handleClearBtn ) ;
82
+ const formElement = document . querySelector ( "form" ) ;
83
+ eventHandlers . handleClearBtn = jest . fn ( ( ) => { } ) ;
84
+ formElement . addEventListener ( "keyup" , eventHandlers . handleClearBtn ) ;
85
85
86
- const event = new KeyboardEvent ( "keyup" ) ;
87
- formElement . dispatchEvent ( event ) ;
86
+ const event = new KeyboardEvent ( "keyup" ) ;
87
+ formElement . dispatchEvent ( event ) ;
88
88
89
- expect ( eventHandlers . handleClearBtn ) . toBeCalled ( ) ;
90
- } ) ;
89
+ expect ( eventHandlers . handleClearBtn ) . toBeCalled ( ) ;
90
+ } ) ;
91
91
92
- test ( "Test addTagButton click event" , ( ) => {
93
- document . body . innerHTML = `
92
+ test ( "Test addTagButton click event" , ( ) => {
93
+ document . body . innerHTML = `
94
94
<button
95
95
class="add-tag create-lesson-input"
96
96
id="addTag"
@@ -99,23 +99,23 @@ describe("Checks that event listeners are called appropriately", () => {
99
99
Tags
100
100
</button>
101
101
` ;
102
- const addTagButton = document . querySelector ( ".add-tag" ) ;
103
- eventHandlers . handleTagVisibility = jest . fn ( ( ) => { } ) ;
104
- addTagButton . addEventListener ( "click" , eventHandlers . handleTagVisibility ) ;
102
+ const addTagButton = document . querySelector ( ".add-tag" ) ;
103
+ eventHandlers . handleTagVisibility = jest . fn ( ( ) => { } ) ;
104
+ addTagButton . addEventListener ( "click" , eventHandlers . handleTagVisibility ) ;
105
105
106
- addTagButton . click ( ) ;
107
- expect ( eventHandlers . handleTagVisibility ) . toBeCalled ( ) ;
108
- } ) ;
106
+ addTagButton . click ( ) ;
107
+ expect ( eventHandlers . handleTagVisibility ) . toBeCalled ( ) ;
108
+ } ) ;
109
109
110
- test ( "Test tagSelectors click event" , ( ) => {
111
- document . body . innerHTML = `
110
+ test ( "Test tagSelectors click event" , ( ) => {
111
+ document . body . innerHTML = `
112
112
<div class="tag-selectors hidden"></div>
113
113
` ;
114
- const tagSelectors = document . querySelector ( ".tag-selectors" ) ;
115
- eventHandlers . handleTagSelect = jest . fn ( ( ) => { } ) ;
116
- tagSelectors . addEventListener ( "click" , eventHandlers . handleTagSelect ) ;
114
+ const tagSelectors = document . querySelector ( ".tag-selectors" ) ;
115
+ eventHandlers . handleTagSelect = jest . fn ( ( ) => { } ) ;
116
+ tagSelectors . addEventListener ( "click" , eventHandlers . handleTagSelect ) ;
117
117
118
- tagSelectors . click ( ) ;
119
- expect ( eventHandlers . handleTagSelect ) . toBeCalled ( ) ;
120
- } ) ;
118
+ tagSelectors . click ( ) ;
119
+ expect ( eventHandlers . handleTagSelect ) . toBeCalled ( ) ;
120
+ } ) ;
121
121
} ) ;
0 commit comments