build(docs-infra): ensure all overloads are shown in interfaces (#43734)

In the API docs, concrete classes do not list the "implementation" overload on a method, since this is not strictly part of its API.

We recently fixed the rendering of interfaces to display all the overloads, since there is no "implementation" overload.

This commit also fixes the rendering of "pseudo-classes", which are a combination of an interface
and a constant.

Fixes #43001

PR Close #43734

aio/tests/e2e/src/api-pages.e2e-spec.ts

@@ -81,4 +81,9 @@ describe('Api pages', () => {
     await page.navigateTo('api/core/testing/TestBedStatic');
     expect(await (await page.getInstanceMethodOverloads('initTestEnvironment')).length).toEqual(2);
   });
+
+  it('should show all overloads of pseudo-class methods', async () => {
+    await page.navigateTo('api/core/testing/TestBed');
+    expect(await (await page.getInstanceMethodOverloads('initTestEnvironment')).length).toEqual(2);
+  });
 });

aio/tools/transforms/angular-api-package/processors/processPseudoClasses.js

@@ -1,12 +1,28 @@
+/**
+ * @dgProcessor processPseudoClasses
+ * @description
+ * If an API element is declared both as a `const` and an `interface` then these are both merged
+ * into a single `interface` document.
+ *
+ * We can identify such cases because the interface doc has one or more items in the
+ * `additionalDeclarations` property.
+ *
+ * This processor will convert such interface docs to class docs and ensure that the content and
+ * members are fixed up appropriately.
+ *
+ * Such pseudo classes should have overloaded members rendered similar to interfaces (i.e. all
+ * overloads are rendered whereas in classes the "implementation overload" is not rendered) we
+ * also mark the doc with the `isPseudoClass` property to be used in templates when rendering.
+ */
 module.exports = function processPseudoClasses(tsHost) {
   return {
     $runAfter: ['readTypeScriptModules'],
     $runBefore: ['parsing-tags'],
     $process(docs) {
       docs.forEach(doc => {
-        if (doc.docType === 'interface' && doc.additionalDeclarations &&
-            doc.additionalDeclarations.length > 0) {
+        if (doc.docType === 'interface' && doc.additionalDeclarations?.length > 0) {
           doc.docType = 'class';
+          doc.isPseudoClass = true;
           const additionalContent = tsHost.getContent(doc.additionalDeclarations[0]);
           if (!doc.content || doc.content === '@publicApi' && additionalContent) {
             doc.content = additionalContent;

aio/tools/transforms/angular-api-package/processors/processPseudoClasses.spec.js

@@ -32,7 +32,7 @@ describe('processPseudoClasses processor', () => {
       jasmine.objectContaining({docType: 'interface', id: 'd'}),
 
       // This is the only one that changes
-      jasmine.objectContaining({docType: 'class', id: 'e'}),
+      jasmine.objectContaining({docType: 'class', id: 'e', isPseudoClass: true}),
 
       jasmine.objectContaining({docType: 'const', id: 'f'}),
       jasmine.objectContaining({docType: 'const', id: 'g'}),

aio/tools/transforms/templates/api/lib/memberHelpers.html

@@ -123,7 +123,7 @@
       </td>
     </tr>
   {%- elseif method.overloads.length < 3 -%}
-    {%- if method.isAbstract or method.containerDoc.docType === 'interface' %}
+    {%- if method.isAbstract or method.containerDoc.docType === 'interface' or method.containerDoc.isPseudoClass %}
     <tr>
       <td>
         {$ renderOverloadInfo(method, cssClass + '-overload', method) $}