astro Architecture Docs
Home / File/ namespaced-component.test.js — astro Source File

namespaced-component.test.js — astro Source File

Architecture documentation for namespaced-component.test.js, a javascript file in the astro codebase. 4 imports, 0 dependents.

File javascript E2ETesting 4 imports

Entity Profile

Dependency Diagram

graph LR
  eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe["namespaced-component.test.js"]
  2ca394f6_a63d_3921_1f12_c5a979ea0039["test-utils.js"]
  eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe --> 2ca394f6_a63d_3921_1f12_c5a979ea0039
  e27f6887_ea47_dd44_7933_5faa0f6bcf4d["testFactory"]
  eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe --> e27f6887_ea47_dd44_7933_5faa0f6bcf4d
  c373140e_7fdf_7fff_8884_991b85bc22b5["waitForHydrate"]
  eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe --> c373140e_7fdf_7fff_8884_991b85bc22b5
  f8fbe851_c5d6_c4ee_c044_67a751668c18["test"]
  eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe --> f8fbe851_c5d6_c4ee_c044_67a751668c18
  style eba234fb_7e9c_fabb_0c7d_1fc6aa6ed8fe fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { expect } from '@playwright/test';
import { testFactory, waitForHydrate } from './test-utils.js';

const test = testFactory(import.meta.url, {
	root: './fixtures/namespaced-component/',
});

let devServer;

test.beforeAll(async ({ astro }) => {
	devServer = await astro.startDevServer();
});

test.afterAll(async () => {
	await devServer.stop();
});

test.describe('Hydrating namespaced components', () => {
	test('Preact Component', async ({ astro, page }) => {
		await page.goto(astro.resolveUrl('/'));

		// Counter declared with: <ns.components.PreactCounter id="preact-counter-namespace" client:load>
		const namespacedCounter = page.locator('#preact-counter-namespace');
		await expect(namespacedCounter, 'component is visible').toBeVisible();

		const namespacedCount = namespacedCounter.locator('pre');
		await expect(namespacedCount, 'initial count is 0').toHaveText('0');

		const namespacedChildren = namespacedCounter.locator('.children');
		await expect(namespacedChildren, 'children exist').toHaveText('preact (namespace import)');

		await waitForHydrate(page, namespacedCounter);

		const namespacedIncrement = namespacedCounter.locator('.increment');
		await namespacedIncrement.click();

		await expect(namespacedCount, 'count incremented by 1').toHaveText('1');

		// Counter declared with: <components.PreactCounterTwo id="preact-counter-named" client:load>
		const namedCounter = page.locator('#preact-counter-named');
		await expect(namedCounter, 'component is visible').toBeVisible();

		const namedCount = namedCounter.locator('pre');
		await expect(namedCount, 'initial count is 0').toHaveText('0');

		const namedChildren = namedCounter.locator('.children');
		await expect(namedChildren, 'children exist').toHaveText('preact (named import)');

		await waitForHydrate(page, namedCounter);

		const namedIncrement = namedCounter.locator('.increment');
		await namedIncrement.click();

		await expect(namedCount, 'count incremented by 1').toHaveText('1');
	});

	test('MDX', async ({ astro, page }) => {
		await page.goto(astro.resolveUrl('/mdx'));

		// Counter declared with: <ns.components.PreactCounter id="preact-counter-namespace" client:load>
		const namespacedCounter = page.locator('#preact-counter-namespace');
		await expect(namespacedCounter, 'component is visible').toBeVisible();

		const namespacedCount = namespacedCounter.locator('pre');
		await expect(namespacedCount, 'initial count is 0').toHaveText('0');

		const namespacedChildren = namespacedCounter.locator('.children');
		await expect(namespacedChildren, 'children exist').toHaveText('preact (namespace import)');

		await waitForHydrate(page, namespacedCounter);

		const namespacedIncrement = namespacedCounter.locator('.increment');
		await namespacedIncrement.click();

		await expect(namespacedCount, 'count incremented by 1').toHaveText('1');

		// Counter declared with: <components.PreactCounterTwo id="preact-counter-named" client:load>
		const namedCounter = page.locator('#preact-counter-named');
		await expect(namedCounter, 'component is visible').toBeVisible();

		const namedCount = namedCounter.locator('pre');
		await expect(namedCount, 'initial count is 0').toHaveText('0');

		const namedChildren = namedCounter.locator('.children');
		await expect(namedChildren, 'children exist').toHaveText('preact (named import)');

		await waitForHydrate(page, namedCounter);

		const namedIncrement = namedCounter.locator('.increment');
		await namedIncrement.click();

		await expect(namedCount, 'count incremented by 1').toHaveText('1');
	});
});

Domain

Dependencies

Source

Frequently Asked Questions

What does namespaced-component.test.js do?
namespaced-component.test.js is a source file in the astro codebase, written in javascript. It belongs to the E2ETesting domain.
What does namespaced-component.test.js depend on?
namespaced-component.test.js imports 4 module(s): test, test-utils.js, testFactory, waitForHydrate.
Where is namespaced-component.test.js in the architecture?
namespaced-component.test.js is located at packages/astro/e2e/namespaced-component.test.js (domain: E2ETesting, directory: packages/astro/e2e).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free