@samitouri / QOS-React-2
Code Commits Issues Pulls Sessions CI/CD
main
main
snap 542 lines 13.4 KB
Raw
1 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
2
3 exports[`ReactFreshBabelPlugin can handle implicit arrow returns 1`] = `
4 var _s = $RefreshSig$(),
5 _s2 = $RefreshSig$(),
6 _s3 = $RefreshSig$(),
7 _s4 = $RefreshSig$(),
8 _s5 = $RefreshSig$(),
9 _s6 = $RefreshSig$();
10 export default _s(() => {
11 _s();
12 return useContext(X);
13 }, "useContext{}");
14 export const Foo = () => {
15 _s2();
16 return useContext(X);
17 };
18 _s2(Foo, "useContext{}");
19 _c = Foo;
20 module.exports = _s3(() => {
21 _s3();
22 return useContext(X);
23 }, "useContext{}");
24 const Bar = () => {
25 _s4();
26 return useContext(X);
27 };
28 _s4(Bar, "useContext{}");
29 _c2 = Bar;
30 const Baz = _s5(memo(_c3 = _s5(() => {
31 _s5();
32 return useContext(X);
33 }, "useContext{}")), "useContext{}");
34 _c4 = Baz;
35 const Qux = () => {
36 _s6();
37 return 0, useContext(X);
38 };
39 _s6(Qux, "useContext{}");
40 _c5 = Qux;
41 var _c, _c2, _c3, _c4, _c5;
42 $RefreshReg$(_c, "Foo");
43 $RefreshReg$(_c2, "Bar");
44 $RefreshReg$(_c3, "Baz$memo");
45 $RefreshReg$(_c4, "Baz");
46 $RefreshReg$(_c5, "Qux");
47 `;
48
49 exports[`ReactFreshBabelPlugin does not consider require-like methods to be HOCs 1`] = `
50 const A = require('A');
51 const B = foo ? require('X') : require('Y');
52 const C = requireCond(gk, 'C');
53 const D = import('D');
54 export default function App() {
55 return <div>
56 <A />
57 <B />
58 <C />
59 <D />
60 </div>;
61 }
62 _c = App;
63 var _c;
64 $RefreshReg$(_c, "App");
65 `;
66
67 exports[`ReactFreshBabelPlugin does not get tripped by IIFEs 1`] = `
68 while (item) {
69 var _s = $RefreshSig$();
70 _s(item => {
71 _s();
72 useFoo();
73 }, "useFoo{}", true)(item);
74 }
75 `;
76
77 exports[`ReactFreshBabelPlugin generates signatures for function declarations calling hooks 1`] = `
78 var _s = $RefreshSig$();
79 export default function App() {
80 _s();
81 const [foo, setFoo] = useState(0);
82 React.useEffect(() => {});
83 return <h1>{foo}</h1>;
84 }
85 _s(App, "useState{[foo, setFoo](0)}\\nuseEffect{}");
86 _c = App;
87 var _c;
88 $RefreshReg$(_c, "App");
89 `;
90
91 exports[`ReactFreshBabelPlugin generates signatures for function expressions calling hooks 1`] = `
92 var _s = $RefreshSig$(),
93 _s2 = $RefreshSig$();
94 export const A = _s(React.memo(_c2 = _s(React.forwardRef(_c = _s((props, ref) => {
95 _s();
96 const [foo, setFoo] = useState(0);
97 React.useEffect(() => {});
98 return <h1 ref={ref}>{foo}</h1>;
99 }, "useState{[foo, setFoo](0)}\\nuseEffect{}")), "useState{[foo, setFoo](0)}\\nuseEffect{}")), "useState{[foo, setFoo](0)}\\nuseEffect{}");
100 _c3 = A;
101 export const B = _s2(React.memo(_c5 = _s2(React.forwardRef(_c4 = _s2(function (props, ref) {
102 _s2();
103 const [foo, setFoo] = useState(0);
104 React.useEffect(() => {});
105 return <h1 ref={ref}>{foo}</h1>;
106 }, "useState{[foo, setFoo](0)}\\nuseEffect{}")), "useState{[foo, setFoo](0)}\\nuseEffect{}")), "useState{[foo, setFoo](0)}\\nuseEffect{}");
107 _c6 = B;
108 function hoc() {
109 var _s3 = $RefreshSig$();
110 return _s3(function Inner() {
111 _s3();
112 const [foo, setFoo] = useState(0);
113 React.useEffect(() => {});
114 return <h1 ref={ref}>{foo}</h1>;
115 }, "useState{[foo, setFoo](0)}\\nuseEffect{}");
116 }
117 export let C = hoc();
118 var _c, _c2, _c3, _c4, _c5, _c6;
119 $RefreshReg$(_c, "A$React.memo$React.forwardRef");
120 $RefreshReg$(_c2, "A$React.memo");
121 $RefreshReg$(_c3, "A");
122 $RefreshReg$(_c4, "B$React.memo$React.forwardRef");
123 $RefreshReg$(_c5, "B$React.memo");
124 $RefreshReg$(_c6, "B");
125 `;
126
127 exports[`ReactFreshBabelPlugin generates valid signature for exotic ways to call Hooks 1`] = `
128 var _s2 = $RefreshSig$();
129 import FancyHook from 'fancy';
130 export default function App() {
131 _s2();
132 var _s = $RefreshSig$();
133 function useFancyState() {
134 _s();
135 const [foo, setFoo] = React.useState(0);
136 useFancyEffect();
137 return foo;
138 }
139 _s(useFancyState, "useState{[foo, setFoo](0)}\\nuseFancyEffect{}", true);
140 const bar = useFancyState();
141 const baz = FancyHook.useThing();
142 React.useState();
143 useThePlatform();
144 return <h1>{bar}{baz}</h1>;
145 }
146 _s2(App, "useFancyState{bar}\\nuseThing{baz}\\nuseState{}\\nuseThePlatform{}", true, function () {
147 return [FancyHook.useThing];
148 });
149 _c = App;
150 var _c;
151 $RefreshReg$(_c, "App");
152 `;
153
154 exports[`ReactFreshBabelPlugin ignores HOC definitions 1`] = `
155 let connect = () => {
156 function Comp() {
157 const handleClick = () => {};
158 return <h1 onClick={handleClick}>Hi</h1>;
159 }
160 return Comp;
161 };
162 function withRouter() {
163 return function Child() {
164 const handleClick = () => {};
165 return <h1 onClick={handleClick}>Hi</h1>;
166 };
167 }
168 ;
169 `;
170
171 exports[`ReactFreshBabelPlugin ignores complex definitions 1`] = `
172 let A = foo ? () => {
173 return <h1>Hi</h1>;
174 } : null;
175 const B = function Foo() {
176 return <h1>Hi</h1>;
177 }();
178 let C = () => () => {
179 return <h1>Hi</h1>;
180 };
181 let D = bar && (() => {
182 return <h1>Hi</h1>;
183 });
184 `;
185
186 exports[`ReactFreshBabelPlugin ignores higher-order functions that are not HOCs 1`] = `
187 const throttledAlert = throttle(function () {
188 alert('Hi');
189 });
190 const TooComplex = function () {
191 return hello;
192 }(() => {});
193 if (cond) {
194 const Foo = thing(() => {});
195 }
196 `;
197
198 exports[`ReactFreshBabelPlugin ignores unnamed function declarations 1`] = `export default function () {}`;
199
200 exports[`ReactFreshBabelPlugin includes custom hooks into the signatures 1`] = `
201 var _s = $RefreshSig$(),
202 _s2 = $RefreshSig$(),
203 _s3 = $RefreshSig$();
204 function useFancyState() {
205 _s();
206 const [foo, setFoo] = React.useState(0);
207 useFancyEffect();
208 return foo;
209 }
210 _s(useFancyState, "useState{[foo, setFoo](0)}\\nuseFancyEffect{}", false, function () {
211 return [useFancyEffect];
212 });
213 const useFancyEffect = () => {
214 _s2();
215 React.useEffect(() => {});
216 };
217 _s2(useFancyEffect, "useEffect{}");
218 export default function App() {
219 _s3();
220 const bar = useFancyState();
221 return <h1>{bar}</h1>;
222 }
223 _s3(App, "useFancyState{bar}", false, function () {
224 return [useFancyState];
225 });
226 _c = App;
227 var _c;
228 $RefreshReg$(_c, "App");
229 `;
230
231 exports[`ReactFreshBabelPlugin includes custom hooks into the signatures when commonjs target is used 1`] = `
232 "use strict";
233
234 Object.defineProperty(exports, "__esModule", {
235 value: true
236 });
237 exports.default = App;
238 var _hooks = require("./hooks");
239 var _s = $RefreshSig$();
240 function App() {
241 _s();
242 const bar = (0, _hooks.useFancyState)();
243 return <h1>{bar}</h1>;
244 }
245 _s(App, "useFancyState{bar}", false, function () {
246 return [_hooks.useFancyState];
247 });
248 _c = App;
249 var _c;
250 $RefreshReg$(_c, "App");
251 `;
252
253 exports[`ReactFreshBabelPlugin only registers pascal case functions 1`] = `
254 function hello() {
255 return 2 * 2;
256 }
257 `;
258
259 exports[`ReactFreshBabelPlugin registers capitalized identifiers in HOC calls 1`] = `
260 function Foo() {
261 return <h1>Hi</h1>;
262 }
263 _c = Foo;
264 export default _c2 = hoc(Foo);
265 export const A = hoc(Foo);
266 _c3 = A;
267 const B = hoc(Foo);
268 _c4 = B;
269 var _c, _c2, _c3, _c4;
270 $RefreshReg$(_c, "Foo");
271 $RefreshReg$(_c2, "%default%");
272 $RefreshReg$(_c3, "A");
273 $RefreshReg$(_c4, "B");
274 `;
275
276 exports[`ReactFreshBabelPlugin registers identifiers used in JSX at definition site 1`] = `
277 import A from './A';
278 import Store from './Store';
279 Store.subscribe();
280 const Header = styled.div\`color: red\`;
281 _c = Header;
282 const StyledFactory1 = styled('div')\`color: hotpink\`;
283 _c2 = StyledFactory1;
284 const StyledFactory2 = styled('div')({
285 color: 'hotpink'
286 });
287 _c3 = StyledFactory2;
288 const StyledFactory3 = styled(A)({
289 color: 'hotpink'
290 });
291 _c4 = StyledFactory3;
292 const FunnyFactory = funny.factory\`\`;
293 let Alias1 = A;
294 let Alias2 = A.Foo;
295 const Dict = {};
296 function Foo() {
297 return <div><A /><B /><StyledFactory1 /><StyledFactory2 /><StyledFactory3 /><Alias1 /><Alias2 /><Header /><Dict.X /></div>;
298 }
299 _c5 = Foo;
300 const B = hoc(A);
301 // This is currently registered as a false positive:
302 _c6 = B;
303 const NotAComponent = wow(A);
304 // We could avoid it but it also doesn't hurt.
305 _c7 = NotAComponent;
306 var _c, _c2, _c3, _c4, _c5, _c6, _c7;
307 $RefreshReg$(_c, "Header");
308 $RefreshReg$(_c2, "StyledFactory1");
309 $RefreshReg$(_c3, "StyledFactory2");
310 $RefreshReg$(_c4, "StyledFactory3");
311 $RefreshReg$(_c5, "Foo");
312 $RefreshReg$(_c6, "B");
313 $RefreshReg$(_c7, "NotAComponent");
314 `;
315
316 exports[`ReactFreshBabelPlugin registers identifiers used in React.createElement at definition site 1`] = `
317 import A from './A';
318 import Store from './Store';
319 Store.subscribe();
320 const Header = styled.div\`color: red\`;
321 _c = Header;
322 const StyledFactory1 = styled('div')\`color: hotpink\`;
323 _c2 = StyledFactory1;
324 const StyledFactory2 = styled('div')({
325 color: 'hotpink'
326 });
327 _c3 = StyledFactory2;
328 const StyledFactory3 = styled(A)({
329 color: 'hotpink'
330 });
331 _c4 = StyledFactory3;
332 const FunnyFactory = funny.factory\`\`;
333 let Alias1 = A;
334 let Alias2 = A.Foo;
335 const Dict = {};
336 function Foo() {
337 return [React.createElement(A), React.createElement(B), React.createElement(StyledFactory1), React.createElement(StyledFactory2), React.createElement(StyledFactory3), React.createElement(Alias1), React.createElement(Alias2), jsx(Header), React.createElement(Dict.X)];
338 }
339 _c5 = Foo;
340 React.createContext(Store);
341 const B = hoc(A);
342 // This is currently registered as a false positive:
343 _c6 = B;
344 const NotAComponent = wow(A);
345 // We could avoid it but it also doesn't hurt.
346 _c7 = NotAComponent;
347 var _c, _c2, _c3, _c4, _c5, _c6, _c7;
348 $RefreshReg$(_c, "Header");
349 $RefreshReg$(_c2, "StyledFactory1");
350 $RefreshReg$(_c3, "StyledFactory2");
351 $RefreshReg$(_c4, "StyledFactory3");
352 $RefreshReg$(_c5, "Foo");
353 $RefreshReg$(_c6, "B");
354 $RefreshReg$(_c7, "NotAComponent");
355 `;
356
357 exports[`ReactFreshBabelPlugin registers likely HOCs with inline functions 1`] = `
358 const A = forwardRef(_c = function () {
359 return <h1>Foo</h1>;
360 });
361 _c2 = A;
362 const B = memo(_c4 = React.forwardRef(_c3 = () => {
363 return <h1>Foo</h1>;
364 }));
365 _c5 = B;
366 export default _c8 = React.memo(_c7 = forwardRef(_c6 = (props, ref) => {
367 return <h1>Foo</h1>;
368 }));
369 var _c, _c2, _c3, _c4, _c5, _c6, _c7, _c8;
370 $RefreshReg$(_c, "A$forwardRef");
371 $RefreshReg$(_c2, "A");
372 $RefreshReg$(_c3, "B$memo$React.forwardRef");
373 $RefreshReg$(_c4, "B$memo");
374 $RefreshReg$(_c5, "B");
375 $RefreshReg$(_c6, "%default%$React.memo$forwardRef");
376 $RefreshReg$(_c7, "%default%$React.memo");
377 $RefreshReg$(_c8, "%default%");
378 `;
379
380 exports[`ReactFreshBabelPlugin registers likely HOCs with inline functions 2`] = `
381 export default _c3 = React.memo(_c2 = forwardRef(_c = function (props, ref) {
382 return <h1>Foo</h1>;
383 }));
384 var _c, _c2, _c3;
385 $RefreshReg$(_c, "%default%$React.memo$forwardRef");
386 $RefreshReg$(_c2, "%default%$React.memo");
387 $RefreshReg$(_c3, "%default%");
388 `;
389
390 exports[`ReactFreshBabelPlugin registers likely HOCs with inline functions 3`] = `
391 export default _c3 = React.memo(_c2 = forwardRef(_c = function Named(props, ref) {
392 return <h1>Foo</h1>;
393 }));
394 var _c, _c2, _c3;
395 $RefreshReg$(_c, "%default%$React.memo$forwardRef");
396 $RefreshReg$(_c2, "%default%$React.memo");
397 $RefreshReg$(_c3, "%default%");
398 `;
399
400 exports[`ReactFreshBabelPlugin registers top-level exported function declarations 1`] = `
401 export function Hello() {
402 function handleClick() {}
403 return <h1 onClick={handleClick}>Hi</h1>;
404 }
405 _c = Hello;
406 export default function Bar() {
407 return <Hello />;
408 }
409 _c2 = Bar;
410 function Baz() {
411 return <h1>OK</h1>;
412 }
413 _c3 = Baz;
414 const NotAComp = 'hi';
415 export { Baz, NotAComp };
416 export function sum() {}
417 export const Bad = 42;
418 var _c, _c2, _c3;
419 $RefreshReg$(_c, "Hello");
420 $RefreshReg$(_c2, "Bar");
421 $RefreshReg$(_c3, "Baz");
422 `;
423
424 exports[`ReactFreshBabelPlugin registers top-level exported named arrow functions 1`] = `
425 export const Hello = () => {
426 function handleClick() {}
427 return <h1 onClick={handleClick}>Hi</h1>;
428 };
429 _c = Hello;
430 export let Bar = props => <Hello />;
431 _c2 = Bar;
432 export default (() => {
433 // This one should be ignored.
434 // You should name your components.
435 return <Hello />;
436 });
437 var _c, _c2;
438 $RefreshReg$(_c, "Hello");
439 $RefreshReg$(_c2, "Bar");
440 `;
441
442 exports[`ReactFreshBabelPlugin registers top-level function declarations 1`] = `
443 function Hello() {
444 function handleClick() {}
445 return <h1 onClick={handleClick}>Hi</h1>;
446 }
447 _c = Hello;
448 function Bar() {
449 return <Hello />;
450 }
451 _c2 = Bar;
452 var _c, _c2;
453 $RefreshReg$(_c, "Hello");
454 $RefreshReg$(_c2, "Bar");
455 `;
456
457 exports[`ReactFreshBabelPlugin registers top-level variable declarations with arrow functions 1`] = `
458 let Hello = () => {
459 const handleClick = () => {};
460 return <h1 onClick={handleClick}>Hi</h1>;
461 };
462 _c = Hello;
463 const Bar = () => {
464 return <Hello />;
465 };
466 _c2 = Bar;
467 var Baz = () => <div />;
468 _c3 = Baz;
469 var sum = () => {};
470 var _c, _c2, _c3;
471 $RefreshReg$(_c, "Hello");
472 $RefreshReg$(_c2, "Bar");
473 $RefreshReg$(_c3, "Baz");
474 `;
475
476 exports[`ReactFreshBabelPlugin registers top-level variable declarations with function expressions 1`] = `
477 let Hello = function () {
478 function handleClick() {}
479 return <h1 onClick={handleClick}>Hi</h1>;
480 };
481 _c = Hello;
482 const Bar = function Baz() {
483 return <Hello />;
484 };
485 _c2 = Bar;
486 function sum() {}
487 let Baz = 10;
488 var Qux;
489 var _c, _c2;
490 $RefreshReg$(_c, "Hello");
491 $RefreshReg$(_c2, "Bar");
492 `;
493
494 exports[`ReactFreshBabelPlugin supports typescript namespace syntax 1`] = `
495 namespace Foo {
496 export namespace Bar {
497 export const A = () => {};
498 _c = A;
499 function B() {}
500 _c2 = B;
501 ;
502 export const B1 = B;
503 }
504 export const C = () => {};
505 _c3 = C;
506 export function D() {}
507 _c4 = D;
508 ;
509 namespace NotExported {
510 export const E = () => {};
511 }
512 }
513 var _c, _c2, _c3, _c4;
514 $RefreshReg$(_c, "Foo$Bar$A");
515 $RefreshReg$(_c2, "Foo$Bar$B");
516 $RefreshReg$(_c3, "Foo$C");
517 $RefreshReg$(_c4, "Foo$D");
518 `;
519
520 exports[`ReactFreshBabelPlugin uses custom identifiers for $RefreshReg$ and $RefreshSig$ 1`] = `
521 var _s = import.meta.refreshSig();
522 export default function Bar() {
523 _s();
524 useContext(X);
525 return <Foo />;
526 }
527 _s(Bar, "useContext{}");
528 _c = Bar;
529 ;
530 var _c;
531 import.meta.refreshReg(_c, "Bar");
532 `;
533
534 exports[`ReactFreshBabelPlugin uses original function declaration if it get reassigned 1`] = `
535 function Hello() {
536 return <h1>Hi</h1>;
537 }
538 _c = Hello;
539 Hello = connect(Hello);
540 var _c;
541 $RefreshReg$(_c, "Hello");
542 `;