prettyDOM function Null safety

String prettyDOM(
  1. Node? node,
  2. {int? maxLength,
  3. int? indent,
  4. int? maxDepth,
  5. bool? min}
)

Returns a readable representation of the DOM tree of the given node.

This can be helpful when debugging tests:

import 'package:react_testing_library/react_testing_library.dart' as rtl;
import 'package:test/test.dart';

main() {
  test('', () {
    final view = rtl.render(someReactVDom);
    print(rtl.prettyDOM(view.container));
  });
}

Options

prettyDOM is built atop Jest's prettyFormat function, which has many options that are only relevant when formatting JavaScript code, not HTML. Because of this, the options exposed here are a subset of the prettyFormat options.

maxLength

An optional argument to limit the size of the resulting string output, for cases when it becomes too large.

indent

The number of spaces in each level of indentation, defaulting to 2.

maxDepth

The number of nested levels to print in the DOM tree.

min

Whether to minimize added space: no indentation nor line breaks. Defaults to false.

At this time, formatting plugins and syntax highlighting are not supported.

See the JS prettyDOM docs for more details and examples.

Implementation

String prettyDOM(
  Node? node, {
  int? maxLength,
  int? indent,
  int? maxDepth,
  bool? min,
}) {
  final options = PrettyDomOptions();
  if (indent != null) options.indent = indent;
  if (maxDepth != null) options.maxDepth = maxDepth;
  if (min != null) options.min = min;

  return _jsPrettyDOM(node, maxLength, options);
}