web-dev-qa-db-fra.com

TypeError: Impossible de lire la propriété 'prototype' de non défini dans le test jest

**************************** édité et mis à jour ******************* *****

J'ai un composant Informations supplémentaires qui utilise la navigation à réaction:

export class AdditionalInfo extends NavigationPureComponent {
  static navigationOptions = ({ navigation }) => ({
    headerLeft: <Button icon="close" onPress={() => navigation.goBack(null)} />,
  })

  buildNavigator = () => {
    const { extendedDescriptions } = this.nav.params
    const tabs = {}

    extendedDescriptions.forEach(({ caption, description }, index) => {
      tabs[`Tab${index}`] = {
        screen: () => (
          <ScrollView style={{ backgroundColor: color('white') }}>
            <Wrapper style={{ paddingTop: spacing() }}>
              <SafeAreaView>
                <Html html={description} />
              </SafeAreaView>
            </Wrapper>
          </ScrollView>
        ),
        navigationOptions: {
          title: caption,
        },
      }
    })

    return createMaterialTopTabNavigator(tabs, {
      backBehavior: 'none',
      lazy: true,
      tabBarOptions: {
        activeTintColor: color('b'),
        inactiveTintColor: color('b'),
        indicatorStyle: {
          backgroundColor: color('b'),
        },
        scrollEnabled: extendedDescriptions.length > 3,
        style: {
          backgroundColor: color('white'),
        },
      },
    })
  }

  render () {
    const AdditionalInfoNavigator = this.buildNavigator()

    return <AdditionalInfoNavigator />
  }

Mon fichier additionalInfo.test.jsx se présente comme suit:

describe('Additional Info', () => {
  test('Additional info component Exists', () => {
    const length = 4
    const extendedDescriptions = Array.from({ length }).map((value, index) => ({
      caption: `Tab ${index}`,
      description: `${lorem}`,
    }))
    const obj = shallow(<AdditionalInfo navigation={{ extendedDescriptions }} />)
  })
})

J'essaie d'écrire un test pour vérifier l'existence de ce composant AdditionalInfo et peut-être un peu plus, mais j'obtiens une erreur étrange indiquant

TypeError: Cannot read property 'prototype' of undefined

      15 | 
      16 |     console.debug(extendedDescriptions)
    > 17 |     const obj = shallow(<AdditionalInfo navigation={{ extendedDescriptions }} />)

Je sens que je ne fournis pas tout ce dont l'instance de test de AdditionalInfo a besoin? Ou est-ce que je n'utilise pas correctement les bas-fonds?

J'utilise le composant NavigationPure qui est défini comme suit:

-----> export const NavigationPureComponent = navMixin (PureComponent)

const navMixin = (CurrentComponent) => {
  class Nav extends CurrentComponent {
    get nav () {
      const value = new Navigation(this)
      // reset `this.nav` to always be value, this way the this
      // get nav function only gets called the first time it's accessed
      Object.defineProperty(this, 'nav', {
        value,
        writable: false,
        configurable: false,
      })
      return value
    }
  }

  Nav.propTypes = {
    navigation: PropTypes.shape({}).isRequired,
  }

  return Nav
}
javascriptreactjsreact-nativejestjsenzyme
1
Ackman

Comment importez-vous le composant dans votre test?

Vous ne l'avez pas décrit ci-dessus, alors j'imagine que vous ne le voyez pas comme un problème. 

J'ai déjà vu cette erreur. Lors de l'exportation d'un composant en tant que classe, vous devez importer le composant dans votre test en tant qu'objet.

Essaye ça:

export class AdditionalInfo extends NavigationPureComponent {}

Lorsque vous importez dans votre test: 

import { AdditionalInfo } from '../pathToYourComponent'
2
zero_cool