Extending interfaces and hover hints

Question

I am working with TypeScript in VS Code. I have three interfaces: A, B and C, each one with two properties. C extends A and B.

interface A {
  A1: boolean;
  A2: boolean;
}

interface B {
  B1: boolean;
  B2: boolean;
}

interface C extends A, B {
  C1: boolean;
  C2: boolean;
}

const ABC: C = {
  A1: true,
  A2: true,
  B1: true,
  B2: true,
  C1: true,
  C2: true,
};

console.log(ABC);

When I hover C I only see its own properties.

This is not convenient, as I can't see the whole interface in the codebase when I use C for any object.

Is this intended?

Answer 1

This is intended because otherwise when extending a more sophisticated interface (like HTMLELement) your preview would get bloated with properties not inherently relevant to your interface. If you really need an index of all avaliable properties of C, just write ABC. (when nothing happens try Ctrl+Space). Or Ctrl+click on C to see its declaration and further on A or B to inspect those.