10 examples of 'userevent react testing library' in JavaScript

162
export function useEvents() {
163
	const { onEvent } = useContext( CheckoutContext );
164
	if ( ! onEvent ) {
165
		throw new Error( 'useEvents can only be used inside a CheckoutProvider' );
166
	}
167
	return onEvent;
168
}

23
render () {
24
  const { text } = this.state;
25
  return (
26
    <View style={styles.container}>
27
      <Image style={styles.logo} source={require('./react.png')} />
28
      <Text style={styles.title}>
29
        Welcome to React Native testing demo app
30
      </Text>
31
      <TextInput
32
        style={styles.input}
33
        placeholder={"write something"}
34
        onChangeText={this.handleTextChange}
35
        value={text}
36
        />
37
      <ReactNativeTestingChild text={text} onClear={this.clearText} />
38
    </View>
39
  );
40
}

76
_enableTVEventHandler() {
77
  this._tvEventHandler = new TVEventHandler();
78
  this._tvEventHandler.enable(this, (cmp, evt) => {
79
    evt &&
80
      evt.eventType &&
81
      evt.eventType !== 'blur' &&
82
      evt.eventType !== 'focus' &&
83
      cmp.setState({
84
        eventFired: evt.eventType
85
      });
86
  });
87
}

68
function TestComponent() {
69
  const TestToken = createToken('test');
70
  useService(TestToken.optional);
71
  didRender = true;
72
  return React.createElement('div', null, 'hello');
73
}

204
function logProps(Component) {
205
    class LogProps extends React.Component {
206
        static foo = 'foo';
207
        static render = 'bar';
208
        render() {
209
            const {forwardedRef, ...rest} = this.props;
210
            return <Component ref={forwardedRef} {...rest} foo='foo' bar='bar' />;
211
        }
212
    }
213
    const ForwardedComponent = React.forwardRef((props, ref) => {
214
        return <LogProps {...props} forwardedRef={ref} />;
215
    });
216
217
    hoistNonReactStatics(ForwardedComponent, LogProps);
218
219
    return ForwardedComponent;
220
}

14
export default function useEvents(ref) {
15
  validates(arguments, ["string="]);
16
  const [groupRef] = useState(ref || uuidv4());
17
  useEffect(() => {
18
    return () => {
19
      removeListenersByGroup(groupRef);
20
    };
21
  }, []);
22
23
  const onFn = function(event, callback, context) {
24
    validates(arguments, ["string", "function", "object="]);
25
    on(groupRef + ":" + event, callback, groupRef, context);
26
    return on(event, callback, groupRef, context);
27
  };
28
29
  const scopedEventsFn = {
30
    emit: function(event, ...args) {
31
      validates(event, "string");
32
      return validates(emit(event, ...args, groupRef), "boolean");
33
    },
34
    mutateEvent: function(sourceEvent, targetEvent, transformArgsFn) {
35
      validates(arguments, ["string", "string|function", "function="]);
36
      return mutateEvent(sourceEvent, targetEvent, transformArgsFn, onFn);
37
    },
38
    on: onFn,
39
    once: function(event, callback, context) {
40
      validates(arguments, ["string", "function", "object="]);
41
      once(groupRef + ":" + event, callback, groupRef, context);
42
      return once(event, callback, groupRef, context);
43
    },
44
    redirectOnEvent: function(event, path, options) {
45
      validates(arguments, ["string", "string", "Object.<string, string>="]);
46
      return redirectOnEvent(event, path, options, onFn);
47
    },
48
    removeListener: function(event, callback, context) {
49
      validates(arguments, ["string", "function", "object="]);
50
      removeListener(groupRef + ":" + event, callback, groupRef, context);
51
      return removeListener(event, callback, groupRef, context);
52
    },
53
  };
54
55
  return validates(
56
    [groupRef, scopedEventsFn],
57
    ["string", "Object.<string, function>"]
58
  );
59
}

45
async function testFireEvent() {
46
    const { container } = render(<button />);
47
    fireEvent.click(container);
48
}

18
function App() {
19
  const [opened, setOpened] = useState(false)
20
21
  const open = useCallback(() => {
22
    setOpened(true)
23
  }, [])
24
25
  const close = useCallback(() => {
26
    setOpened(false)
27
  }, [])
28
29
  return (
30
    <React.Fragment>
31
      <Header
32
        primary="SidePanel"
33
        secondary={
34
          <Button onClick={open} mode="strong">
35
            Open SidePanel
36
          </Button>
37
        }
38
      />
39
      <Split
40
        primary={
41
          <Box>
42
            <Lorem repeat={10} />
43
          </Box>
44
        }
45
        secondary={
46
          <Box
47
            css={`
48
              display: flex;
49
              align-items: center;
50
              justify-content: center;
51
            `}
52
          >
53
            <Lorem repeat={3} />
54
          </Box>
55
        }
56
      />
57
58
      <SidePanel title="My Panel" opened={opened} onClose={close}>
59
        <MySidePanelContent />
60
      </SidePanel>
61
    </React.Fragment>
62
  )
63
}

21
export function mountTest(reactElement: React.Element<*>): ReturnType {
22
  const wrapper = mount(<Wrap>{reactElement}</Wrap>);
23
24
  return {
25
    // $FlowIssue needs better enzyme typings
26
    node: ReactTesting.findDOMNodes('a', wrapper.node)[0],
27
    unmount: wrapper.unmount.bind(wrapper),
28
    setProps: wrapper.setProps.bind(wrapper),
29
  };
30
}

311
function useEventListener(
312
313
314
315
ref,
316
event,
317
listener,
318
options)
319
320
{var _ref = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {},_ref$enabled = _ref.enabled,enabled = _ref$enabled === void 0 ? true : _ref$enabled;
321
  React.useEffect(function () {
322
    if (ref.current === null) {
323
      return;
324
    }
325
326
    if (enabled) {
327
      ref.current.addEventListener(event, listener, options);
328
    } else if (listener) {
329
      ref.current.removeEventListener(event, listener);
330
    }
331
332
    return function () {
333
      if (!ref.current) {
334
        return;
335
      }
336
337
      ref.current.removeEventListener(event, listener);
338
    };
339
  }, [ref.current, listener, options, enabled]);
340
}