(1/12) How do you define watchers for concurrency in a child that depends on a parent’s provide/inject object that is reactive in Vue 3?

---

• Use watchers in main.js for concurrency watchers only
• No approach to watch inject data
• If the parent provided a reactive or ref object, the child can inject that same object and define watch(() => injectedData.property, ...), plus onInvalidate if needed for concurrency
• Use defineProps for concurrency watchers

(2/12) If you want to define a plugin that adds a global method on app.config.globalProperties in Vue 3, how do you structure it?

---

• Use watchers with defineExpose in the plugin
• You must define watchers in main.js for global methods
• Export an object with install(app) { app.config.globalProperties.$myMethod = () => ... }
• Plugins are not supported in Vue 3

(3/12) How can you define multiple root components in a Vue 3 SPA (Single-Page Application)?

---

• Use defineApps() with an array of root apps
• Vue 3 only supports one root component per page
• Use onBeforeUnmount to load more components
• Create multiple calls to createApp() mounting on different elements

(4/12) What is one difference between using defineExpose() in <script setup> and returning values from a standard setup() function regarding parent access?

---

• There is no difference; both do the same job exactly
• defineExpose() specifically controls which methods/refs are accessible when the parent uses a template ref on this child
• Using defineExpose() forces watchers on all returned values
• Returning values from setup() is not visible to the parent unless <script setup> is used

(5/12) Which statement about watchers is correct if you create watchers referencing properties from a dev-time reactivity transform ($ref syntax) in Vue 3’s experimental build?

---

• You must do watchers with .value calls
• The reactivity transform rewrite automatically ensures watchers see $ref as a normal ref. If you do watch($refVar, ...) in code, it compiles to watch(refVar, ...). This is advanced usage requiring the transform plugin
• Use watchers in main.js for concurrency watchers only
• No approach to watch $ref variables

(6/12) How would you typically test a Vue 3 component that uses the Composition API with a popular testing library?

---

• You cannot test Composition API components with standard testing tools
• Write a standalone Node.js script that calls the component's setup() function
• Install the official 'vue-3-test' library
• Use @vue/test-utils (v2+), Jest or Vitest, and mount the component normally

(7/12) How do you define watchers that only run after child components are updated in Vue 3 (the entire sub-tree is patched)?

---

• Use flush: 'post' so the watch callback runs after the DOM patch cycle completes, including child updates
• Impossible to wait for child updates in watchers
• Use watchers in main.js for concurrency watchers only
• Use defineProps for concurrency watchers

(8/12) Which approach might you use if you want to create a typed custom renderer in Vue 3 that targets a platform other than the DOM (e.g. a canvas or terminal)?

---

• Use watchers in main.js for concurrency
• Import createRenderer from @vue/runtime-core, implement the required nodeOps and patchProp methods for your platform, and rely on the Vue 3 core reactivity
• Impossible to create custom renderers in Vue 3
• Use defineCustomRenderer in the Options API

(9/12) Which statement about watchers is correct if you define them in a custom directive in Vue 3 that manipulates the bound element based on concurrent data changes?

---

• Use defineProps for concurrency watchers
• Use watchers in main.js for concurrency watchers only
• Impossible to define watchers inside a directive
• Directives receive hooks (created, mounted, etc.), but they don't directly attach watchers to the user’s reactivity unless you import watch from 'vue' in the directive code, or rely on some provided reference. This is advanced usage and can complicate concurrency

(10/12) Which is the best description of a 'custom element' in Vue 3?

---

• A feature that transforms a Vue component into a standard web component
• A built-in directive for advanced animations
• A special syntax for creating mixins
• An alias for dynamic components

(11/12) Which statement about watchers is correct if you define them for concurrency referencing a computed property that returns a promise in Vue 3?

---

• Use watchers in main.js for concurrency watchers only
• They can watch the computed result. If the promise changes (like a re-computation returning a new promise), the watcher triggers. For concurrency, you can handle onInvalidate in the callback
• Use defineProps for concurrency watchers
• No approach to watch computed promises

(12/12) Which statement is correct about implementing your own unmount logic for watchers in an advanced scenario where you do not rely on a standard component context in Vue 3?

---

• Use defineProps for concurrency watchers
• You can createEffectScope manually, run watch(...) inside it, then call scope.stop() whenever you decide to unmount logic. This bypasses the standard component lifecycle
• Watchers cannot exist outside a component context
• Use watchers in main.js for concurrency watchers only

Submit