diff --git a/packages/elements/test/create-custom-element-env_spec.ts b/packages/elements/test/create-custom-element-env_spec.ts new file mode 100644 index 0000000000000..783e7426eab78 --- /dev/null +++ b/packages/elements/test/create-custom-element-env_spec.ts @@ -0,0 +1,52 @@ +/** + * @license + * Copyright Google LLC All Rights Reserved. + * + * Use of this source code is governed by an MIT-style license that can be + * found in the LICENSE file at https://angular.io/license + */ + +import {Component} from '@angular/core'; +import {createApplication} from '@angular/platform-browser'; +import {browserDetection} from '@angular/platform-browser/testing/src/browser_util'; + +import {createCustomElement} from '../public_api'; + +if (browserDetection.supportsCustomElements) { + describe('createCustomElement with env injector', () => { + let testContainer: HTMLDivElement; + + beforeEach(() => { + testContainer = document.createElement('div'); + document.body.appendChild(testContainer); + }); + + afterEach(() => { + document.body.removeChild(testContainer); + (testContainer as any) = null; + }); + + it('should use provided EnvironmentInjector to create a custom element', async () => { + @Component({ + standalone: true, + template: `Hello, standalone element!`, + }) + class TestStandaloneCmp { + } + + const appRef = await createApplication(); + + try { + const NgElementCtor = createCustomElement(TestStandaloneCmp, {injector: appRef.injector}); + + customElements.define('test-standalone-cmp', NgElementCtor); + const customEl = document.createElement('test-standalone-cmp'); + testContainer.appendChild(customEl); + + expect(testContainer.innerText).toBe('Hello, standalone element!'); + } finally { + appRef.destroy(); + } + }); + }); +}