How to use the cavy.wrap function in cavy

To help you get started, we’ve selected a few cavy examples, based on popular ways it is used in public projects.

github pixielabs / cavy / test / CavyTester / src / scenarios / buttonFunctionComponent.js View on Github external
import React, { useState } from 'react';
import { Button, Text } from 'react-native';
import { useCavy, wrap } from 'cavy';

export const key = 'ButtonFunctionComponent';

const buttonId = `${key}.Button`;
const textId = `${key}.Text`;

const FunctionButton = ({ onPress, title }) => (
  <Button onPress={onPress} title={title} />
);

const WrappedFunctionButton = wrap(FunctionButton);

export const Screen = () => {
  const [showHiddenMessage, setShowHiddenMessage] = useState(false);
  const generateTestHook = useCavy();

  return (
    <>
      <WrappedFunctionButton
        ref={generateTestHook(buttonId)}
        title="Click to show message"
        onPress={() => setShowHiddenMessage(true)}
      />
      {showHiddenMessage && (
        <Text ref={generateTestHook(textId)}>
          I only show up when you press the button
        </Text>
github pixielabs / cavy / sample-app / CavyDirectory / app / EmployeeListItem.js View on Github external
export default ({ data, navigation }) => {
  const generateTestHook = useCavy();
  const WrappedText = wrap(Text);

  return (
    <TouchableHighlight
      ref={generateTestHook(`${navigation.state.routeName}.${data.firstName}${data.lastName}`)}
      onPress={ () => navigation.navigate('EmployeeDetails', {employeeId: data.id}) }
      underlayColor={'#EEEEEE'}>
      <View style={styles.container}>
        <Image source={{uri: data.picture}} style={styles.picture} />
        <View>
          <Text>{data.firstName} {data.lastName}</Text>
          <WrappedText
            ref={generateTestHook(`${navigation.state.routeName}.${data.title}`)}
            style={styles.title}
          >
            {data.title}
          </WrappedText>
github pixielabs / cavy / sample-app / CavyDirectory / app / ActionBar.js View on Github external
render() {
    const TestableActionButton = wrap(ActionButton);

    return (
      <View style={styles.container}>
        <TestableActionButton ref={this.props.generateTestHook('ActionBar.EmailButton')} text="email" icon={require('./assets/email.png')} onPress={this.sendMail.bind(this)}/>
        <ActionButton text="call" icon={require('./assets/call.png')} onPress={this.callNumber.bind(this)}/>
        <ActionButton text="message" icon={require('./assets/sms.png')} onPress={this.sendMessage.bind(this)}/>
      </View>
    );
  }
}

cavy

An integration test framework for React Native.

MIT
Latest version published 1 year ago

Package Health Score

57 / 100
Full package analysis