diff --git a/test/plugin_functional/plugins/kbn_top_nav/kibana.json b/test/plugin_functional/plugins/kbn_top_nav/kibana.json
new file mode 100644
index 0000000000000..b274e80b9ef65
--- /dev/null
+++ b/test/plugin_functional/plugins/kbn_top_nav/kibana.json
@@ -0,0 +1,9 @@
+{
+ "id": "kbn_top_nav",
+ "version": "0.0.1",
+ "kibanaVersion": "kibana",
+ "configPath": ["kbn_top_nav"],
+ "server": false,
+ "ui": true,
+ "requiredPlugins": ["navigation"]
+}
\ No newline at end of file
diff --git a/test/plugin_functional/plugins/kbn_top_nav/package.json b/test/plugin_functional/plugins/kbn_top_nav/package.json
new file mode 100644
index 0000000000000..510d681a4a75c
--- /dev/null
+++ b/test/plugin_functional/plugins/kbn_top_nav/package.json
@@ -0,0 +1,18 @@
+{
+ "name": "kbn_top_nav",
+ "version": "1.0.0",
+ "main": "target/test/plugin_functional/plugins/kbn_top_nav",
+ "kibana": {
+ "version": "kibana",
+ "templateVersion": "1.0.0"
+ },
+ "license": "Apache-2.0",
+ "scripts": {
+ "kbn": "node ../../../../scripts/kbn.js",
+ "build": "rm -rf './target' && tsc"
+ },
+ "devDependencies": {
+ "typescript": "3.7.2"
+ }
+}
+
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx b/test/plugin_functional/plugins/kbn_top_nav/public/application.tsx
similarity index 71%
rename from test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx
rename to test/plugin_functional/plugins/kbn_top_nav/public/application.tsx
index f77db4fe1654e..0f65e6159796b 100644
--- a/test/plugin_functional/plugins/kbn_tp_top_nav/public/top_nav.tsx
+++ b/test/plugin_functional/plugins/kbn_top_nav/public/application.tsx
@@ -18,11 +18,15 @@
*/
import React from 'react';
-import './initialize';
-import { npStart } from 'ui/new_platform';
+import { render, unmountComponentAtNode } from 'react-dom';
+import { AppMountParameters } from 'kibana/public';
+import { AppPluginDependencies } from './types';
-export const AppWithTopNav = () => {
- const { TopNavMenu } = npStart.plugins.navigation.ui;
+export const renderApp = (
+ depsStart: AppPluginDependencies,
+ { appBasePath, element }: AppMountParameters
+) => {
+ const { TopNavMenu } = depsStart.navigation.ui;
const config = [
{
id: 'new',
@@ -32,10 +36,12 @@ export const AppWithTopNav = () => {
testId: 'demoNewButton',
},
];
-
- return (
+ render(
Hey
-
+ ,
+ element
);
+
+ return () => unmountComponentAtNode(element);
};
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/public/initialize.js b/test/plugin_functional/plugins/kbn_top_nav/public/index.ts
similarity index 58%
rename from test/plugin_functional/plugins/kbn_tp_top_nav/public/initialize.js
rename to test/plugin_functional/plugins/kbn_top_nav/public/index.ts
index d46e47f6d248a..bd478f1dd3bdb 100644
--- a/test/plugin_functional/plugins/kbn_tp_top_nav/public/initialize.js
+++ b/test/plugin_functional/plugins/kbn_top_nav/public/index.ts
@@ -17,25 +17,8 @@
* under the License.
*/
-import { npSetup } from 'ui/new_platform';
+import { PluginInitializer } from 'kibana/public';
+import { TopNavTestPlugin, TopNavTestPluginSetup, TopNavTestPluginStart } from './plugin';
-const customExtension = {
- id: 'registered-prop',
- label: 'Registered Button',
- description: 'Registered Demo',
- run() {},
- testId: 'demoRegisteredNewButton',
-};
-
-npSetup.plugins.navigation.registerMenuItem(customExtension);
-
-const customDiscoverExtension = {
- id: 'registered-discover-prop',
- label: 'Registered Discover Button',
- description: 'Registered Discover Demo',
- run() {},
- testId: 'demoDiscoverRegisteredNewButton',
- appName: 'discover',
-};
-
-npSetup.plugins.navigation.registerMenuItem(customDiscoverExtension);
+export const plugin: PluginInitializer = () =>
+ new TopNavTestPlugin();
diff --git a/test/plugin_functional/plugins/kbn_top_nav/public/plugin.tsx b/test/plugin_functional/plugins/kbn_top_nav/public/plugin.tsx
new file mode 100644
index 0000000000000..a433de98357fb
--- /dev/null
+++ b/test/plugin_functional/plugins/kbn_top_nav/public/plugin.tsx
@@ -0,0 +1,65 @@
+/*
+ * Licensed to Elasticsearch B.V. under one or more contributor
+ * license agreements. See the NOTICE file distributed with
+ * this work for additional information regarding copyright
+ * ownership. Elasticsearch B.V. licenses this file to you under
+ * the Apache License, Version 2.0 (the "License"); you may
+ * not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import { CoreSetup, Plugin, AppMountParameters } from 'kibana/public';
+import { NavigationPublicPluginSetup } from '../../../../../src/plugins/navigation/public';
+import { AppPluginDependencies } from './types';
+
+export class TopNavTestPlugin implements Plugin {
+ public setup(core: CoreSetup, { navigation }: { navigation: NavigationPublicPluginSetup }) {
+ const customExtension = {
+ id: 'registered-prop',
+ label: 'Registered Button',
+ description: 'Registered Demo',
+ run() {},
+ testId: 'demoRegisteredNewButton',
+ };
+
+ navigation.registerMenuItem(customExtension);
+
+ const customDiscoverExtension = {
+ id: 'registered-discover-prop',
+ label: 'Registered Discover Button',
+ description: 'Registered Discover Demo',
+ run() {},
+ testId: 'demoDiscoverRegisteredNewButton',
+ appName: 'discover',
+ };
+
+ navigation.registerMenuItem(customDiscoverExtension);
+
+ core.application.register({
+ id: 'topNavMenu',
+ title: 'Top nav menu example',
+ async mount(params: AppMountParameters) {
+ const { renderApp } = await import('./application');
+ const services = await core.getStartServices();
+ return renderApp(services[1] as AppPluginDependencies, params);
+ },
+ });
+
+ return {};
+ }
+
+ public start() {}
+ public stop() {}
+}
+
+export type TopNavTestPluginSetup = ReturnType;
+export type TopNavTestPluginStart = ReturnType;
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/index.js b/test/plugin_functional/plugins/kbn_top_nav/public/types.ts
similarity index 71%
rename from test/plugin_functional/plugins/kbn_tp_top_nav/index.js
rename to test/plugin_functional/plugins/kbn_top_nav/public/types.ts
index b4c3e05c28b66..c70a78bedb54f 100644
--- a/test/plugin_functional/plugins/kbn_tp_top_nav/index.js
+++ b/test/plugin_functional/plugins/kbn_top_nav/public/types.ts
@@ -17,15 +17,8 @@
* under the License.
*/
-export default function(kibana) {
- return new kibana.Plugin({
- uiExports: {
- app: {
- title: 'Top Nav Menu test',
- description: 'This is a sample plugin for the functional tests.',
- main: 'plugins/kbn_tp_top_nav/app',
- },
- hacks: ['plugins/kbn_tp_top_nav/initialize'],
- },
- });
+import { NavigationPublicPluginStart } from '../../../../../src/plugins/navigation/public';
+
+export interface AppPluginDependencies {
+ navigation: NavigationPublicPluginStart;
}
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/tsconfig.json b/test/plugin_functional/plugins/kbn_top_nav/tsconfig.json
similarity index 100%
rename from test/plugin_functional/plugins/kbn_tp_top_nav/tsconfig.json
rename to test/plugin_functional/plugins/kbn_top_nav/tsconfig.json
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/package.json b/test/plugin_functional/plugins/kbn_tp_top_nav/package.json
deleted file mode 100644
index 7102d24d3292d..0000000000000
--- a/test/plugin_functional/plugins/kbn_tp_top_nav/package.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
- "name": "kbn_tp_top_nav",
- "version": "1.0.0",
- "kibana": {
- "version": "kibana",
- "templateVersion": "1.0.0"
- },
- "license": "Apache-2.0"
-}
diff --git a/test/plugin_functional/plugins/kbn_tp_top_nav/public/app.js b/test/plugin_functional/plugins/kbn_tp_top_nav/public/app.js
deleted file mode 100644
index e7f97e68c086d..0000000000000
--- a/test/plugin_functional/plugins/kbn_tp_top_nav/public/app.js
+++ /dev/null
@@ -1,54 +0,0 @@
-/*
- * Licensed to Elasticsearch B.V. under one or more contributor
- * license agreements. See the NOTICE file distributed with
- * this work for additional information regarding copyright
- * ownership. Elasticsearch B.V. licenses this file to you under
- * the Apache License, Version 2.0 (the "License"); you may
- * not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing,
- * software distributed under the License is distributed on an
- * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
- * KIND, either express or implied. See the License for the
- * specific language governing permissions and limitations
- * under the License.
- */
-
-import React from 'react';
-import { render, unmountComponentAtNode } from 'react-dom';
-
-import { uiModules } from 'ui/modules';
-import chrome from 'ui/chrome';
-
-// This is required so some default styles and required scripts/Angular modules are loaded,
-// or the timezone setting is correctly applied.
-import 'ui/autoload/all';
-
-import { AppWithTopNav } from './top_nav';
-
-const app = uiModules.get('apps/topnavDemoPlugin', ['kibana']);
-
-app.config($locationProvider => {
- $locationProvider.html5Mode({
- enabled: false,
- requireBase: false,
- rewriteLinks: false,
- });
-});
-
-function RootController($scope, $element) {
- const domNode = $element[0];
-
- // render react to DOM
- render(, domNode);
-
- // unmount react on controller destroy
- $scope.$on('$destroy', () => {
- unmountComponentAtNode(domNode);
- });
-}
-
-chrome.setRootController('topnavDemoPlugin', RootController);