Skip to content
New issue

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

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

Already on GitHub? Sign in 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.

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

No branches or pull requests

4 participants