enzymejs / enzyme

JavaScript Testing utilities for React
https://enzymejs.github.io/enzyme/
MIT License
19.96k stars 2.01k forks source link

Cannot invoke an object which is possibly 'undefined' #2547

Open rogerprz opened 3 years ago

rogerprz commented 3 years ago

Thanks for reporting an issue to us! We're glad you are using and invested in Enzyme. Before submitting, please read over our commonly reported issues to prevent duplicates!

All common issues

Notoriously common issues

If you haven't found any duplicated issues, please report it with your environment!

Current behavior

I'm getting the error in the title. Maybe i'm not setting it up correctly. I'm looking to update onGetErrorMessage which then checks it what I pass in is valid. IF it is not valid it updates the ariaLabel which is what i'm expected to equal test error.

 test('should set error when page number not valid and update aria-label', () => {
            const pageChangeCallback = jest.fn().mockName('pageChange callback');

            const tree = mount(
                <DemoPagination
                    pageCount={10}
                    selectedPage={1}
                    onPageChange={pageChangeCallback}
                    validationErrorMessageText="test error"
                />
            )

            const selectedPage = tree.find(TextField);
            console.log('PEPE:', tree.props())
            console.log('SSSS:', selectedPage.props())
            // tree.prop('onGetErrorMessage')('a');
            // console.log('III:', selectedPage.setProps({ onGetErrorMessage: onGetErrorMessage('a') }))
            // selectedPage.instance()
            selectedPage.invoke('onGetErrorMessage')('a');
            // selectedPage.props().onGetErrorMessage('a');
            console.log('AFFFT:', selectedPage.props())
            // selectedPage.props().onGetErrorMessage('a') as any;
            const errorMessage = tree.find(Text).at(2);
            // console.log('EERR:', errorMessage.props())
            expect(errorMessage).toBeDefined();
            // expect(selectedPage.prop('ariaLabel')).toContain('test error');
  });
  <>
      <Text>{initialPagingText}</Text>
      <TextField
          theme={theme}
          styles={classNames.textFieldStyles}
          value={selectedPageString}
          onKeyPress={onKeyPress}
          onChange={onChange}
          onBlur={onBlur}
          onGetErrorMessage={onGetErrorMessage}
          ariaLabel={errorMessage ? `alert error ${errorMessage}` : pagingText}
      />
      <Text>{endingPagingLabelText ?? getEndingPagingText(rangeEndIndex, pageCount)}</Text>
  </>

Expected behavior

For the property function to be called without getting the object which is possibly 'undefined'.

Your environment

API

Version

library version
enzyme 3.11
react 16.8.5
react-dom 16.8.5
react-test-renderer n/a
adapter (below) 16

Adapter

ljharb commented 3 years ago

The error you're describing is a TypeScript error, not a JS one. It's got nothing to do with enzyme.