isInTheDocument top-level constant Matchers

Matcher const isInTheDocument

Allows you to assert whether an element is present in the document or not.

Similar to jest-dom's toBeInTheDocument matcher.

Note: This matcher does not find detached elements.

The element must be added to the document to be found by isInTheDocument. If you desire to search in a detached element please use: containsElement

Examples

<div>
  <span data-test-id="html-element"><span>Html Element</span></span>
  <svg data-test-id="svg-element"></svg>
</div>

import 'package:react/react.dart' as react;
import 'package:react_testing_library/matchers.dart' show isInTheDocument;
import 'package:react_testing_library/react_testing_library.dart' as rtl;
import 'package:test/test.dart';

main() {
  test('', () {
    // Render the DOM shown in the example snippet above
    final view = rtl.render(react.div({},
      react.span({'data-test-id': 'html-element'},
        react.span({}, 'Html Element'),
      ),
      react.svg({'data-test-id': 'svg-element'}),
    ));

    // Use the `isInTheDocument` matcher as the second argument of `expect()`
    expect(view.getByTestId('html-element'), isInTheDocument);
    expect(view.getByTestId('svg-element'), isInTheDocument);
    expect(view.queryByTestId('does-not-exist'), isNot(isInTheDocument));
  });
}

NOTE: render() supports React vDom elements / custom components created using either the

react or over_react packages.

The examples shown here use the react package since the react_testing_library does not have a direct dependency on over_react - but both libraries are fully supported.

{@category Matchers}

Implementation

const Matcher isInTheDocument = _IsInTheDocument();