Assert that an element has the given text.

var element = createElement(`
  <section>
    <h1>Assert on text content</h1>
    <p>
      Learn about howto assert on the text content of a DOM element.
    </p>
    <p data-test-id='learn'>
      Learn more <a href='https://example.com/learn'>here</a>.
    </p>
  </section>
`);
 
expect(
  element,
  'queried for first',
  'h1',
  'to have text',
  'Assert on text content'
);
 
expect(element, 'queried for first', 'p', 'to have text', /^Learn/);
 
expect(
  element,
  'queried for first',
  'p',
  'to have text',
  expect.it('to have length', 62)
);
 
expect(
  element,
  'queried for first',
  '[data-test-id=learn]',
  'to have text',
  'Learn more here.'
);

In case of a failing expectation you get the following output:

expect(
  element,
  'queried for first',
  'p',
  'to have text',
  'Read about howto assert on the text content of a DOM element.'
);

expected
<section>
  
<h1>Assert on text content</h1>
  
<p>
  
Learn about howto assert on the text content of a DOM element.
</p>
  
<p data-test-id="learn">
  
Learn more
  
<a href="https://example.com/learn">...</a>
  
.
</p>
</section>
queried for first p to have text 'Read about howto assert on the text content of a DOM element.'
  
expected
<p>
  
Learn about howto assert on the text content of a DOM element.
</p>
to have text 'Read about howto assert on the text content of a DOM element.'
 
Learn about howto assert on the text content of a DOM element.
Read about howto assert on the text content of a DOM element.