Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

text() returns element instead of text #1800

Closed
nagarajasr opened this issue Aug 29, 2018 · 4 comments
Closed

text() returns element instead of text #1800

nagarajasr opened this issue Aug 29, 2018 · 4 comments
Labels

Comments

@nagarajasr
Copy link

Describe the bug
text() returns element instead of text

To Reproduce
Steps to reproduce the behavior:

src/namaskaara.tsx

import * as React from 'react';
import * as ReactDOM from 'react-dom';

import './app.css'; // contains a single line @import '~bootstrap/dist/css/bootstrap.min.css';

import { Alert } from 'reactstrap';

export const namaskaara =
          <div>
            <Alert color="info">namaskaara react !</Alert>
          </div>;

src/test/namaskaara.spec.tsx

import React from 'react';
import { shallow } from 'enzyme';
import { Alert } from 'reactstrap';

import { namaskaara } from '../namaskaara';

it('renders correctly', () => {
  const wrapper = shallow(namaskaara);
  expect(wrapper.find('div').equals(<div><Alert color="info">namaskaara react !</Alert></div>)).toBe(true); // passes
  expect(wrapper.find(Alert).equals(<Alert color="info">namaskaara react !</Alert>)).toBe(true); // passes
  expect(wrapper.find(Alert).text()).toEqual('namaskaara react !'); // fails
  console.log(wrapper.find(Alert).text()); // shows <Alert /> instead of namaskaara react !
});

Expected behavior
expect that text() returns 'namaskaara react !'

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: Linux
  • Browser google chrome
  • Version latest

Smartphone (please complete the following information):

  • Device: NA
  • OS: NA
  • Browser NA
  • Version NA

Additional context

  • jest output *
  ● renders correctly

    expect(received).toEqual(expected)

    Expected value to equal:
      "namaskaara react !"
    Received:
      "<Alert />"

      15 |   expect(wrapper.find('div').equals(<div><Alert color="info">namaskaara react !</Alert></div>)).toBe(true);
      16 |   expect(wrapper.find(Alert).equals(<Alert color="info">namaskaara react !</Alert>)).toBe(true);
    > 17 |   expect(wrapper.find(Alert).text()).toEqual('namaskaara react !');
         |                                      ^
      18 |   console.log(wrapper.find(Alert).text());
      19 | });
@ljharb
Copy link
Member

ljharb commented Aug 29, 2018

You're using shallow rendering - which means the Alert will not be rendered initially. You can use wrapper.find(Alert).shallow().text(), however.

@protoEvangelion
Copy link

wrapper.dive().dive().text() worked for me. You can chain as many dives as you need.

@dylankil
Copy link

None of the above work anymore, how is this seemingly trivial task achieved these days?

@ljharb
Copy link
Member

ljharb commented Feb 25, 2021

I see you’ve filed a new issue; i assure you the way the above works has not changed.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants