Plugin Extensions: E2E test addLink and legacy APIs (grafana#92394)

* cleanup tests

* more cleanup

* added links

* test legacy hooks

* test legacy hooks

* update codeowners

* revert package changes

* add project specfic example script

* remove console log

* Update .github/CODEOWNERS

Co-authored-by: Timur Olzhabayev <[email protected]>

* Update CODEOWNERS

* use correct file names

* cleanup tests

---------

Co-authored-by: Timur Olzhabayev <[email protected]>

Author: sunker

.github/CODEOWNERS

@@ -319,6 +319,7 @@
 /e2e/ @grafana/grafana-frontend-platform
 /e2e/cloud-plugins-suite/ @grafana/partner-datasources
 /e2e/plugin-e2e/plugin-e2e-api-tests/ @grafana/plugins-platform-frontend
+/e2e/test-plugins/grafana-extensionstest-app/ @grafana/plugins-platform-frontend 
 
 # Packages
 /packages/ @grafana/grafana-frontend-platform @grafana/plugins-platform-frontend

e2e/plugin-e2e/plugin-e2e-api-tests/as-admin-user/extensions/extensionPoints.spec.ts

@@ -32,4 +32,4 @@ Note that this plugin extends the `@grafana/plugin-configs` configs which is why
 
 ## Run Playwright tests
 
-- `yarn e2e:playwright`
+- `yarn playwright --project extensions-test-app`

e2e/plugin-e2e/plugin-e2e-api-tests/as-admin-user/extensions/extensions.spec.ts

@@ -1,7 +1,7 @@
 import { PluginExtension, PluginExtensionLink, SelectableValue, locationUtil } from '@grafana/data';
 import { isPluginExtensionLink, locationService } from '@grafana/runtime';
 import { Button, ButtonGroup, ButtonSelect, Modal, Stack, ToolbarButton } from '@grafana/ui';
-import { testIds } from '../testIds';
+import { testIds } from '../../testIds';
 
 import { ReactElement, useMemo, useState } from 'react';
 

e2e/plugin-e2e/plugin-e2e-api-tests/as-admin-user/extensions/useExposedComponent.spec.ts

@@ -1,18 +1,22 @@
 import { Route, Routes } from 'react-router-dom';
+
 import { AppRootProps } from '@grafana/data';
+
 import { ROUTES } from '../../constants';
-import { AddedComponents, ExposedComponents, LegacyAPIs } from '../../pages';
-import { testIds } from '../testIds';
+import { AddedComponents, AddedLinks, ExposedComponents, LegacyGetters, LegacyHooks } from '../../pages';
+import { testIds } from '../../testIds';
 
 export function App(props: AppRootProps) {
   return (
     <div data-testid={testIds.container} style={{ marginTop: '5%' }}>
       <Routes>
-        <Route path={ROUTES.LegacyAPIs} element={<LegacyAPIs />} />
+        <Route path={ROUTES.LegacyGetters} element={<LegacyGetters />} />
+        <Route path={ROUTES.LegacyHooks} element={<LegacyHooks />} />
         <Route path={ROUTES.ExposedComponents} element={<ExposedComponents />} />
         <Route path={ROUTES.AddedComponents} element={<AddedComponents />} />
+        <Route path={ROUTES.AddedLinks} element={<AddedLinks />} />
 
-        <Route path={'*'} element={<LegacyAPIs />} />
+        <Route path={'*'} element={<LegacyGetters />} />
       </Routes>
     </div>
   );