wip: config.ignoredElements compat

packages/runtime-core/src/apiCreateApp.ts

@@ -15,7 +15,8 @@ import { RootHydrateFunction } from './hydration'
 import { devtoolsInitApp, devtoolsUnmountApp } from './devtools'
 import { isFunction, NO, isObject } from '@vue/shared'
 import { version } from '.'
-import { installCompatMount, installLegacyConfigTraps } from './compat/global'
+import { installCompatMount } from './compat/global'
+import { installLegacyConfigTraps } from './compat/globalConfig'
 
 export interface App<HostElement = any> {
   version: string

packages/runtime-core/src/compat/deprecations.ts

@@ -149,6 +149,6 @@ export function warnDeprecation(key: DeprecationTypes, ...args: any[]) {
   warn(
     `[DEPRECATION] ${
       typeof message === 'function' ? message(...args) : message
-    }${link ? `\nFor more details, see ${link}` : ``}`
+    }${link ? `\n  Details: ${link}` : ``}`
   )
 }

packages/runtime-core/src/compat/global.ts

@@ -27,6 +27,7 @@ import { Directive } from '../directives'
 import { nextTick } from '../scheduler'
 import { warnDeprecation, DeprecationTypes } from './deprecations'
 import { version } from '..'
+import { LegacyConfig } from './globalConfig'
 
 /**
  * @deprecated the default `Vue` export has been removed in Vue 3. The type for
@@ -73,34 +74,6 @@ export type CompatVue = Pick<App, 'version' | 'component' | 'directive'> & {
   filter(name: string, arg: any): null
 }
 
-// legacy config warnings
-export type LegacyConfig = {
-  /**
-   * @deprecated `config.silent` option has been removed
-   */
-  silent?: boolean
-  /**
-   * @deprecated use __VUE_PROD_DEVTOOLS__ compile-time feature flag instead
-   * https://github.com/vuejs/vue-next/tree/master/packages/vue#bundler-build-feature-flags
-   */
-  devtools?: boolean
-  /**
-   * @deprecated use `config.isCustomElement` instead
-   * https://v3.vuejs.org/guide/migration/global-api.html#config-ignoredelements-is-now-config-iscustomelement
-   */
-  ignoredElements?: (string | RegExp)[]
-  /**
-   * @deprecated
-   * https://v3.vuejs.org/guide/migration/keycode-modifiers.html
-   */
-  keyCodes?: Record<string, number | number[]>
-  /**
-   * @deprecated
-   * https://v3.vuejs.org/guide/migration/global-api.html#config-productiontip-removed
-   */
-  productionTip?: boolean
-}
-
 export let isCopyingConfig = false
 
 // Legacy global Vue constructor
@@ -362,30 +335,3 @@ export function installCompatMount(
     return instance.proxy!
   }
 }
-
-// dev only
-export function installLegacyConfigTraps(config: AppConfig) {
-  const legacyConfigOptions: Record<string, DeprecationTypes> = {
-    silent: DeprecationTypes.CONFIG_SILENT,
-    devtools: DeprecationTypes.CONFIG_DEVTOOLS,
-    ignoredElements: DeprecationTypes.CONFIG_IGNORED_ELEMENTS,
-    keyCodes: DeprecationTypes.CONFIG_KEY_CODES,
-    productionTip: DeprecationTypes.CONFIG_PRODUCTION_TIP
-  }
-
-  Object.keys(legacyConfigOptions).forEach(key => {
-    let val = (config as any)[key]
-    Object.defineProperty(config, key, {
-      enumerable: true,
-      get() {
-        return val
-      },
-      set(newVal) {
-        if (!isCopyingConfig) {
-          warnDeprecation(legacyConfigOptions[key])
-        }
-        val = newVal
-      }
-    })
-  })
-}

packages/runtime-core/src/compat/globalConfig.ts

@@ -0,0 +1,69 @@
+import { isArray, isString } from '@vue/shared'
+import { AppConfig } from '../apiCreateApp'
+import { isRuntimeOnly } from '../component'
+import { DeprecationTypes, warnDeprecation } from './deprecations'
+import { isCopyingConfig } from './global'
+
+// legacy config warnings
+export type LegacyConfig = {
+  /**
+   * @deprecated `config.silent` option has been removed
+   */
+  silent?: boolean
+  /**
+   * @deprecated use __VUE_PROD_DEVTOOLS__ compile-time feature flag instead
+   * https://github.com/vuejs/vue-next/tree/master/packages/vue#bundler-build-feature-flags
+   */
+  devtools?: boolean
+  /**
+   * @deprecated use `config.isCustomElement` instead
+   * https://v3.vuejs.org/guide/migration/global-api.html#config-ignoredelements-is-now-config-iscustomelement
+   */
+  ignoredElements?: (string | RegExp)[]
+  /**
+   * @deprecated
+   * https://v3.vuejs.org/guide/migration/keycode-modifiers.html
+   */
+  keyCodes?: Record<string, number | number[]>
+  /**
+   * @deprecated
+   * https://v3.vuejs.org/guide/migration/global-api.html#config-productiontip-removed
+   */
+  productionTip?: boolean
+}
+
+// dev only
+export function installLegacyConfigTraps(config: AppConfig) {
+  const legacyConfigOptions: Record<string, DeprecationTypes> = {
+    silent: DeprecationTypes.CONFIG_SILENT,
+    devtools: DeprecationTypes.CONFIG_DEVTOOLS,
+    ignoredElements: DeprecationTypes.CONFIG_IGNORED_ELEMENTS,
+    keyCodes: DeprecationTypes.CONFIG_KEY_CODES,
+    productionTip: DeprecationTypes.CONFIG_PRODUCTION_TIP
+  }
+
+  Object.keys(legacyConfigOptions).forEach(key => {
+    let val = (config as any)[key]
+    Object.defineProperty(config, key, {
+      enumerable: true,
+      get() {
+        return val
+      },
+      set(newVal) {
+        if (!isCopyingConfig) {
+          warnDeprecation(legacyConfigOptions[key])
+        }
+        val = newVal
+
+        // compat for runtime ignoredElements -> isCustomElement
+        if (key === 'ignoredElements' && !isRuntimeOnly() && isArray(newVal)) {
+          config.isCustomElement = tag => {
+            return newVal.some(
+              val => (isString(val) ? val === tag : val.test(tag))
+            )
+          }
+        }
+      }
+    })
+  })
+}