testClassNameOverrides function

  1. @isTestGroup
void testClassNameOverrides(
  1. BuilderOnlyUiFactory<UiProps> factory,
  2. dynamic childrenFactory()
)

Common test for verifying that DomProps.classNames added by the component can be blacklisted by the consumer using DomProps.classNameBlacklist.

Typically not consumed standalone. Use commonComponentTests instead.

Related: testClassNameMerging

Implementation

@isTestGroup
void testClassNameOverrides(BuilderOnlyUiFactory factory, dynamic childrenFactory()) {
  late Set<String> classesToOverride;
  var error;

  setUp(() {
    /// Render a component without any overrides to get the classes added by the component.
    var reactInstanceWithoutOverrides = render(
        (factory()
          ..addProp(forwardedPropBeacon, true)
        )(childrenFactory()),
        autoTearDown: false
    );

    // Catch and rethrow getForwardingTargets-related errors so we can use classesToOverride in the test description,
    // but still fail the test if something goes wrong.
    try {
      classesToOverride = getForwardingTargets(reactInstanceWithoutOverrides)
          .map((target) => findDomNode(target)!.classes)
          .expand((CssClassSet classSet) => classSet)
          .toSet();
    } catch(e) {
      error = e;
    }

    unmount(reactInstanceWithoutOverrides);
  });

  testFunction('can override added class names', () {
    if (error != null) {
      throw error;
    }

    // Override any added classes and verify that they are blacklisted properly.
    var reactInstance = render(
        (factory()
          ..addProp(forwardedPropBeacon, true)
          ..classNameBlacklist = classesToOverride.join(' ')
        )(childrenFactory())
    );

    final forwardingTargetNodes = getForwardingTargets(reactInstance).map(findDomNode);
    expect(forwardingTargetNodes, everyElement(
        hasExactClasses('')
    ), reason: '$classesToOverride not overridden');
  });
}