# Angular: NG0912: Component ID generation collision detected. Components 'A' and 'B' with selector 'app-x' use the same ID

**Code:** `NG0912` · **Category:** Angular · **Seen on:** Angular, TypeScript

Angular generated the same internal id for two different components — usually two components with the same selector, template and styles.

## Meaning

Component ids are derived from selector, template, styles and more. Collisions are a warning in dev mode and can break style encapsulation (one component gets the other's styles). Make the components differ (unique selector, class name) or set an explicit `id` in the decorator.

## Common causes

- Two components with the same selector, template and styles
- Copy-pasted component not edited
- A library bundled twice with different versions
- Generated components from a template with identical metadata
- Test doubles redefining a component with the same decorator

## Quick fix

1. Give each component a unique selector
2. Set a distinct `id` in the `@Component` options
3. Deduplicate the library version (check lockfile)

## Detailed fix by platform

### Angular

1. Rename the selector or add `id: 'unique-id'` to `@Component({...})`
2. Run `npm ls @angular/core` to spot duplicate Angular copies

## How to diagnose

1. **Components** — Which two are named?
2. **Duplicates** — Same metadata?
3. **Packages** — Two copies of the same library?

---
Source: [WhatIsMyError](https://whatismyerror.com/errors/angular/ng0912-component-id-collision)