main
js 136 lines 3.64 KB
Raw
1 /**
2 * Copyright (c) Meta Platforms, Inc. and affiliates.
3 *
4 * This source code is licensed under the MIT license found in the
5 * LICENSE file in the root directory of this source tree.
6 *
7 * @emails react-core
8 */
9
10 'use strict';
11
12 let React;
13 let ReactDOMClient;
14 let act;
15
16 describe('SyntheticClipboardEvent', () => {
17 let container;
18
19 beforeEach(() => {
20 React = require('react');
21 ReactDOMClient = require('react-dom/client');
22 act = require('internal-test-utils').act;
23
24 // The container has to be attached for events to fire.
25 container = document.createElement('div');
26 document.body.appendChild(container);
27 });
28
29 afterEach(() => {
30 document.body.removeChild(container);
31 container = null;
32 });
33
34 describe('ClipboardEvent interface', () => {
35 describe('clipboardData', () => {
36 describe('when event has clipboardData', () => {
37 it("returns event's clipboardData", async () => {
38 let expectedCount = 0;
39
40 // Mock clipboardData since jsdom implementation doesn't have a constructor
41 const clipboardData = {
42 dropEffect: null,
43 effectAllowed: null,
44 files: null,
45 items: null,
46 types: null,
47 };
48 const eventHandler = event => {
49 expect(event.clipboardData).toBe(clipboardData);
50 expectedCount++;
51 };
52 const root = ReactDOMClient.createRoot(container);
53 await act(() => {
54 root.render(
55 <div
56 onCopy={eventHandler}
57 onCut={eventHandler}
58 onPaste={eventHandler}
59 />,
60 );
61 });
62
63 const div = container.firstChild;
64
65 let event;
66 event = document.createEvent('Event');
67 event.initEvent('copy', true, true);
68 event.clipboardData = clipboardData;
69 await act(() => {
70 div.dispatchEvent(event);
71 });
72 event = document.createEvent('Event');
73 event.initEvent('cut', true, true);
74 event.clipboardData = clipboardData;
75 await act(() => {
76 div.dispatchEvent(event);
77 });
78
79 event = document.createEvent('Event');
80 event.initEvent('paste', true, true);
81 event.clipboardData = clipboardData;
82 await act(() => {
83 div.dispatchEvent(event);
84 });
85
86 expect(expectedCount).toBe(3);
87 });
88 });
89 });
90 });
91
92 describe('EventInterface', () => {
93 it('is able to `preventDefault` and `stopPropagation`', async () => {
94 let expectedCount = 0;
95
96 const eventHandler = event => {
97 expect(event.isDefaultPrevented()).toBe(false);
98 event.preventDefault();
99 expect(event.isDefaultPrevented()).toBe(true);
100 expect(event.isPropagationStopped()).toBe(false);
101 event.stopPropagation();
102 expect(event.isPropagationStopped()).toBe(true);
103 expectedCount++;
104 };
105
106 const root = ReactDOMClient.createRoot(container);
107
108 await act(() => {
109 root.render(
110 <div
111 onCopy={eventHandler}
112 onCut={eventHandler}
113 onPaste={eventHandler}
114 />,
115 );
116 });
117
118 const div = container.firstChild;
119
120 let event;
121 event = document.createEvent('Event');
122 event.initEvent('copy', true, true);
123 div.dispatchEvent(event);
124
125 event = document.createEvent('Event');
126 event.initEvent('cut', true, true);
127 div.dispatchEvent(event);
128
129 event = document.createEvent('Event');
130 event.initEvent('paste', true, true);
131 div.dispatchEvent(event);
132
133 expect(expectedCount).toBe(3);
134 });
135 });
136 });