Vue3: Installed extensions throw unhandled exception

rak-phillip commented 3 weeks ago

Navigating to the local cluster while an extension is installed can throw an unhandled error, causing Dashboard to stop functioning.

Reproduction steps

In a stable Rancher instance running dashboard with Vue2, install the following extensions from the ui-plugin-examples repository. The following extensions were installed for this test:

Clock
Extensions-Api-Demo
Large Extension

When starting a development server, make sure that you use the stable instance of Rancher as the backend for testing.

In the development version of Rancher running dashboard with Vue3, navigate to the Local Cluster Explorer.

Actual behavior

An error overlay is rendered with the following:

Uncaught (in promise) TypeError: can't access property "extend", c.a is undefined
    eb32 Banner.vue:6
    Webpack 128
[Banner.vue:6:15](webpack://extensions-api-demo-0.1.0//Users/aalves/Desktop/PROJECTS/alex-ui-plugin-examples/node_modules/@rancher/shell/rancher-components/Banner/Banner.vue?ca18)

Other warnings are logged to the console:

[Vue warn]: Invalid VNode type: undefined (undefined) 
  at <Component resource= 
Object { id: "local", type: "management.cattle.io.cluster", links: {…}, actions: {…}, apiVersion: "management.cattle.io/v3", kind: "Cluster", metadata: {…}, spec: {…}, status: {…}, … }
 > 
  at <SimpleBox key="extensionCards0" class="extension-card" style=undefined > 
  at <ClusterExplorerIndexPage class="outlet" onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouterView key="/c/local/explorer" class="outlet" > 
  at <Default onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< null > > 
  at <RouterView key=1 > 
  at <App>

Expected behavior

The Local Cluster Explorer renders the same way that it does without extensions installed.

codyrancher commented 2 weeks ago

I think we should resolve this in a way where we don't load the plugins unless they target rancher 2.10 or greater. @jordojordo do you remember which label/annotation we should use for this?

jordojordo commented 2 weeks ago

@codyrancher we would use the catalog.cattle.io/rancher-version annotation.

rancher / dashboard