Price: ${{ price() }}
',\n standalone: true,\n})\nexport class ProductComponent {\n name = input('Unknown Product');\n price = input(0);\n}\n\ntest('render with inputs', async () => {\n const screen = await render(ProductComponent, {\n inputs: {\n name: 'Laptop',\n price: 1299.99,\n },\n });\n\n await expect.element(screen.getByText('Laptop')).toBeVisible();\n await expect.element(screen.getByText(/Price: \\$1299\\.99/)).toBeVisible();\n});\n```\n\nWorks with both signal-based inputs (`input()`) and `@Input()` decorators.\n\n## Outputs\n\nSubscribe to component outputs using the `outputs` option:\n\n```ts\nimport { Component, output } from '@angular/core';\nimport { vi } from 'vitest';\n\n@Component({\n template: '',\n standalone: true,\n})\nexport class MessageComponent {\n send = outputAge: {{ age() }}
\nRole: {{ role() }}
\n `,\n})\nexport class ProfileComponent {\n name = input('Guest');\n age = input(0);\n role = input('user');\n}\n\ntest('pass inputs via route data', async () => {\n const routes: Routes = [\n {\n path: 'profile',\n component: ProfileComponent,\n data: {\n name: 'Jane Doe',\n age: 30,\n role: 'admin',\n },\n },\n ];\n\n const { locator, componentClassInstance } = await render(ProfileComponent, {\n withRouting: {\n routes,\n initialRoute: '/profile',\n },\n });\n\n // Inputs are automatically bound from route data\n expect(componentClassInstance.name()).toBe('Jane Doe');\n expect(componentClassInstance.age()).toBe(30);\n expect(componentClassInstance.role()).toBe('admin');\n\n await expect.element(locator.getByText('Jane Doe')).toBeVisible();\n});\n```\n\n### Disabling Input Binding\n\nIf you need to manually handle route data via `ActivatedRoute` instead of automatic input binding, use `disableInputBinding`:\n\n```ts\ntest('disable automatic input binding', async () => {\n const routes: Routes = [\n {\n path: 'profile',\n component: ProfileComponent,\n data: { name: 'Jane Doe' },\n },\n ];\n\n const { componentClassInstance } = await render(ProfileComponent, {\n withRouting: {\n routes,\n initialRoute: '/profile',\n disableInputBinding: true, // Inputs will NOT be bound from route data\n },\n });\n\n // Inputs retain their default values\n expect(componentClassInstance.name()).toBe('Guest');\n});\n```\n\n## Component Providers\n\nIf you need to add or override [component providers](https://angular.dev/guide/di/defining-dependency-providers#component-or-directive-providers), you can use the `componentProviders` option.\n\n```ts\n@Component({\n template: '