fix(ivy): set `ng-version` attribute on root component (#27175)

PR Close #27175

packages/core/src/render3/component_ref.ts

@@ -16,16 +16,16 @@ import {ElementRef as viewEngine_ElementRef} from '../linker/element_ref';
 import {NgModuleRef as viewEngine_NgModuleRef} from '../linker/ng_module_factory';
 import {RendererFactory2} from '../render/api';
 import {Type} from '../type';
-
+import {VERSION} from '../version';
 import {assertComponentType, assertDefined} from './assert';
 import {LifecycleHooksFeature, createRootComponent, createRootComponentView, createRootContext} from './component';
 import {getComponentDef} from './definition';
 import {NodeInjector} from './di';
 import {createLViewData, createNodeAtIndex, createTView, createViewNode, elementCreate, locateHostElement, refreshDescendantViews} from './instructions';
 import {ComponentDef, RenderFlags} from './interfaces/definition';
-import {TContainerNode, TElementContainerNode, TElementNode, TNode, TNodeType, TViewNode} from './interfaces/node';
-import {RElement, RendererFactory3, domRendererFactory3} from './interfaces/renderer';
-import {FLAGS, HEADER_OFFSET, INJECTOR, LViewData, LViewFlags, RootContext, TVIEW} from './interfaces/view';
+import {TContainerNode, TElementContainerNode, TElementNode, TNode, TNodeType} from './interfaces/node';
+import {RElement, RendererFactory3, domRendererFactory3, isProceduralRenderer} from './interfaces/renderer';
+import {HEADER_OFFSET, LViewData, LViewFlags, RootContext, TVIEW} from './interfaces/view';
 import {enterView, leaveView} from './state';
 import {defaultScheduler, getTNode} from './util';
 import {createElementRef} from './view_engine_compatibility';
@@ -141,6 +141,14 @@ export class ComponentFactory<T> extends viewEngine_ComponentFactory<T> {
     const renderer = rendererFactory.createRenderer(hostRNode, this.componentDef);
     const rootViewInjector =
         ngModule ? createChainedInjector(injector, ngModule.injector) : injector;
+
+    if (rootSelectorOrNode && hostRNode) {
+      ngDevMode && ngDevMode.rendererSetAttribute++;
+      isProceduralRenderer(renderer) ?
+          renderer.setAttribute(hostRNode, 'ng-version', VERSION.full) :
+          hostRNode.setAttribute('ng-version', VERSION.full);
+    }
+
     // Create the root view. Uses empty TView and ContentTemplate.
     const rootView: LViewData = createLViewData(
         renderer, createTView(-1, null, 1, 0, null, null, null), rootContext, rootFlags, undefined,

packages/core/test/bundling/hello_world_r2/bundle.golden_symbols.json

@@ -440,6 +440,9 @@
   {
     "name": "UnsubscriptionErrorImpl"
   },
+  {
+    "name": "VERSION"
+  },
   {
     "name": "VIEWS"
   },

packages/core/test/bundling/todo_r2/bundle.golden_symbols.json

@@ -926,6 +926,9 @@
   {
     "name": "VALID_ELEMENTS"
   },
+  {
+    "name": "VERSION"
+  },
   {
     "name": "VIEWS"
   },

packages/platform-server/test/integration_spec.ts

@@ -539,7 +539,6 @@ class HiddenModule {
       });
       afterEach(() => { expect(called).toBe(true); });
 
-      fixmeIvy('to investigate') &&
       it('using long form should work', async(() => {
            const platform =
                platformDynamicServer([{provide: INITIAL_CONFIG, useValue: {document: doc}}]);
@@ -551,14 +550,12 @@ class HiddenModule {
                      .toPromise();
                })
                .then((b) => {
-                     expect(platform.injector.get(PlatformState).renderToString())
-                         .toBe(expectedOutput);
+                 expect(platform.injector.get(PlatformState).renderToString()).toBe(expectedOutput);
                  platform.destroy();
                  called = true;
                });
          }));
 
-      fixmeIvy('to investigate') &&
       it('using renderModule should work', async(() => {
            renderModule(AsyncServerModule, {document: doc}).then(output => {
              expect(output).toBe(expectedOutput);
@@ -609,7 +606,6 @@ class HiddenModule {
          }));
 
 
-      fixmeIvy('to investigate') &&
       it('sets a prefix for the _nghost and _ngcontent attributes', async(() => {
            renderModule(ExampleStylesModule, {document: doc}).then(output => {
              expect(output).toMatch(
@@ -662,7 +658,6 @@ class HiddenModule {
                });
              }));
 
-      fixmeIvy('to investigate') &&
       it('should call render hook', async(() => {
            renderModule(RenderHookModule, {document: doc}).then(output => {
              // title should be added by the render hook.
@@ -673,7 +668,6 @@ class HiddenModule {
            });
          }));
 
-      fixmeIvy('to investigate') &&
       it('should call multiple render hooks', async(() => {
            const consoleSpy = spyOn(console, 'warn');
            renderModule(MultiRenderHookModule, {document: doc}).then(output => {
@@ -856,7 +850,6 @@ class HiddenModule {
       beforeEach(() => { called = false; });
       afterEach(() => { expect(called).toBe(true); });
 
-      fixmeIvy('to investigate') &&
       it('adds transfer script tag when using renderModule', async(() => {
            renderModule(TransferStoreModule, {document: '<app></app>'}).then(output => {
              expect(output).toBe(defaultExpectedOutput);
@@ -876,7 +869,6 @@ class HiddenModule {
            });
          })));
 
-      fixmeIvy('to investigate') &&
       it('cannot break out of <script> tag in serialized output', async(() => {
            renderModule(EscapedTransferStoreModule, {
              document: '<esc-app></esc-app>'