angular/components · error

This TestElement was not created by the…

Error message

This TestElement was not created by the TestbedHarnessEnvironment

What it means

TestbedHarnessEnvironment.getNativeElement only unwraps UnitTestElement instances it created itself. Passing a TestElement produced by a different environment (e.g. TestbedHarnessEnvironment from another module injector or a non-testbed environment) fails the instanceof check. The library throws instead of returning a wrong/undefined DOM node.

Solutions

  1. Only pass TestElement instances obtained from the same TestbedHarnessEnvironment (harness.host or environment-level APIs)
  2. Use harness.host() and await it to get the environment-created TestElement instead of constructing elements manually
  3. Ensure a single copy of @angular/cdk is installed/bundled (check for duplicate @angular/cdk versions in node_modules)
  4. Use (el as any).element only if you are certain the element is a UnitTestElement, with a guard

Example fix

// before
const el = someOtherEnv.getTestElement(nativeEl);
const dom = TestbedHarnessEnvironment.getNativeElement(el); // throws
// after
const harness = await loader.getHarness(MyCompHarness);
const testEl = await harness.host();
const dom = TestbedHarnessEnvironment.getNativeElement(testEl); // ok
Defensive patterns

Strategy: type-guard

Validate before calling

import { UnitTestElement } from '@angular/cdk/testing/testbed';
if (!(el instanceof UnitTestElement)) {
  throw new Error('Pass a TestElement created by TestbedHarnessEnvironment');
}

Type guard

import { UnitTestElement } from '@angular/cdk/testing/testbed';
import { TestElement } from '@angular/cdk/testing';
function isUnitTestElement(el: TestElement): el is UnitTestElement {
  return el instanceof UnitTestElement;
}

Try / catch

try {
  const native = TestbedHarnessEnvironment.getNativeElement(el);
} catch (e) {
  if ((e as Error).message.includes('not created by the TestbedHarnessEnvironment')) {
    throw new Error('Obtain the element from the same harness environment');
  }
  throw e;
}

Prevention

When it happens

Trigger: Calling TestbedHarnessEnvironment.getNativeElement(el) where el was created by another harness environment implementation (e.g. Selenium/Playwright environment, or a UnitTestElement from a different Angular testing module instance).

Common situations: Mixing harness environments across test bundles; sharing TestElement instances between Karma testbed tests and e2e-style environments; multiple copies of @angular/cdk/testing bundled in one app causing instanceof to fail across realms.

Related errors


AI-assisted analysis of angular/components@0411926e7d (2026-08-31). Data as JSON: /api/errors/66756635a296f4b4. Report an issue: GitHub.

Appendix: source

Thrown at src/cdk/testing/testbed/testbed-harness-environment.ts:144

  }

  /**
   * Creates a `HarnessLoader` at the document root. This can be used if harnesses are
   * located outside of a fixture (e.g. overlays appended to the document body).
   */
  static documentRootLoader(
    fixture: ComponentFixture<unknown>,
    options?: TestbedHarnessEnvironmentOptions,
  ): HarnessLoader {
    return new TestbedHarnessEnvironment(document.body, fixture, options);
  }

  /** Gets the native DOM element corresponding to the given TestElement. */
  static getNativeElement(el: TestElement): Element {
    if (el instanceof UnitTestElement) {
      return el.element;
    }
    throw Error('This TestElement was not created by the TestbedHarnessEnvironment');
  }

  /**
   * Creates an instance of the given harness type, using the fixture's root element as the
   * harness's host element. This method should be used when creating a harness for the root element
   * of a fixture, as components do not have the correct selector when they are created as the root
   * of the fixture.
   */
  static async harnessForFixture<T extends ComponentHarness>(
    fixture: ComponentFixture<unknown>,
    harnessType: ComponentHarnessConstructor<T>,
    options?: TestbedHarnessEnvironmentOptions,
  ): Promise<T> {
    const environment = new TestbedHarnessEnvironment(fixture.nativeElement, fixture, options);
    await environment.forceStabilize();
    return environment.createComponentHarness(harnessType, fixture.nativeElement);
  }

View on GitHub (pinned to 0411926e7d)