over_react_test 2.10.1

A library for testing OverReact components

OverReact Test #

Pub Build Status Test Coverage Documentation

A library for testing OverReact components.

Using it in your project #

  1. Import it into your test files:

     import 'package:over_react_test/over_react_test.dart';
    
  2. Run your tests:

     $ pub run test test/your_test_file.dart
    

Naming Conventions #

Variables and Types

UsageActual TypeSuggested Referencing
render and render helper functionsReactComponent | Elementinstance
Component classReactClasstype
VDOM Instance (invoked UiProps)ReactElement-ReactElement or not suffixed
findDomNode, queryByTestId, etc.Elementnode
The Dart componentreact.Component (backed by ReactComponent)dartInstance
Invoked UiFactoryUiPropsbuilder

Example:

test('my test' () {
  var sampleBuilder = Sample();
  var sampleReactElement = sampleBuilder(); // Or var sample = sampleBuilder();
  var instance = render(sampleInstance);
  SampleComponent sampleDartInstance = getDartComponent(instance);
  var sampleNode = findDomNode(instance);
});

Test IDs

When coming up with test ID strings:

  • DO NOT use spaces; space-delimited strings will be treated as separate test IDs

    Just like CSS class names, you can use multiple test IDs together, and use any one of them to target a given component/node.

  • PREFER following our naming scheme for consistency across projects:

    <library>.<Component>[.<subpart>...].<part>

    We recommend including a library abbreviation and component name within a test ID so that it's easy to track down where that ID came from.

    Namespacing (.<subpart>) can be added however it makes sense.

    Finally, test IDs should be descriptive and useful in the context of tests.

    Examples:

    • wsd.DatepickerPrimitive.goToSelectedButton
    • sox.AbstractDataLayoutGroup.headerBlock.title
  • CONSIDER adding multiple IDs to serve different purposes

    for (var i = 0; i < items.length; i++) {
      // ...
        ..addTestId('foo.Bar.menuItem')
        ..addTestId('foo.Bar.menuItem.$i')
        ..addTestId('foo.Bar.menuItem.${items[i].id}')
      // ...
    }
    

    With the output of above code, you can:

    • target all of the Bar component's menu items using foo.Bar.menuItem
    • target the 4th item using foo.Bar.menuItem.3
    • target the item corresponding to an item with id baz123 using foo.Bar.menuItem.baz123

    This won't always be needed, but it comes in handy in certain cases.

Documentation #

You would never skip reading the docs for a new language you are asked to learn, so please don't skip over reading our API documentation either.

Contributing #

Yes please! (Please read our contributor guidelines first)

Versioning #

The over_react_test library adheres to Semantic Versioning:

  • Any API changes that are not backwards compatible will bump the major version (and reset the minor / patch).
  • Any new functionality that is added in a backwards-compatible manner will bump the minor version (and reset the patch).
  • Any backwards-compatible bug fixes that are added will bump the patch version.
1
likes
45
pub points
80%
popularity

Publisher

workiva.com

A library for testing OverReact components

Homepage
Repository (GitHub)
View/report issues

Documentation

API reference

License

Apache 2.0 (LICENSE)

Dependencies

js, matcher, meta, over_react, react, test

More

Packages that depend on over_react_test