feat: support passing additional permissions to the iframe #911
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const view = props.tab.view as ModuleIframeView | ||
| const isPersistent = view.persistent !== false | ||
| const allowedPermissions = ['clipboard-write', 'clipboard-read'] | ||
| const allowedPermissions = ['clipboard-write', 'clipboard-read', ...(view.permissions || [])] |
Contributor
There was a problem hiding this comment.
Cached iframes don't update their permissions when remounted with different permission configurations. The allow attribute is only set when creating a new iframe, not when reusing a cached one.
View Details
📝 Patch Details
diff --git a/packages/devtools/client/components/IframeView.vue b/packages/devtools/client/components/IframeView.vue
index b9d87d69..fe8b119d 100644
--- a/packages/devtools/client/components/IframeView.vue
+++ b/packages/devtools/client/components/IframeView.vue
@@ -3,7 +3,7 @@ import { useElementBounding } from '@vueuse/core'
import { computed, nextTick, onMounted, onUnmounted, reactive, ref, watchEffect } from 'vue'
import { getColorMode, useInjectionClient } from '~/composables/client'
-const iframeCacheMap = new Map<string, HTMLIFrameElement>()
+const iframeCacheMap = new Map<string, { element: HTMLIFrameElement, allowAttribute: string }>()
</script>
<script setup lang="ts">
@@ -24,18 +24,20 @@ onMounted(() => {
const view = props.tab.view as ModuleIframeView
const isPersistent = view.persistent !== false
const allowedPermissions = ['clipboard-write', 'clipboard-read', ...(view.permissions || [])]
+ const allowAttribute = allowedPermissions.join('; ')
- if (iframeCacheMap.get(key.value) && isPersistent) {
- iframeEl.value = iframeCacheMap.get(key.value)!
+ const cached = iframeCacheMap.get(key.value)
+ if (cached && isPersistent && cached.allowAttribute === allowAttribute) {
+ iframeEl.value = cached.element
iframeEl.value.style.visibility = 'visible'
}
else {
iframeEl.value = document.createElement('iframe')
- iframeEl.value.setAttribute('allow', allowedPermissions.join('; '))
+ iframeEl.value.setAttribute('allow', allowAttribute)
iframeEl.value.setAttribute('aria-label', 'Nuxt Devtools')
if (isPersistent)
- iframeCacheMap.set(key.value, iframeEl.value)
+ iframeCacheMap.set(key.value, { element: iframeEl.value, allowAttribute })
iframeEl.value.src = view.src
// CORS
try {
Analysis
Cached iframes don't update permissions when remounted with different configurations
What fails: IframeView.vue caches iframes by tab name and reuses them on remount. When a cached iframe is remounted with different permissions in the tab configuration, the iframe retains its original allow attribute instead of updating to the new permissions.
How to reproduce:
- Create a module with a custom tab that uses a factory function for
addCustomTab() - Mount the tab with
permissions: ['camera'] - Navigate away (iframe is cached but hidden)
- Call
refreshCustomTabs()to trigger a refresh where the factory returns the same tab name but withpermissions: ['microphone', 'geolocation'] - Navigate back to the tab
- The cached iframe still has
allow="clipboard-write; clipboard-read; camera"instead of the new permissions
Result: The iframe retains the old permission set. Since the allow attribute cannot be updated after an iframe loads per browser security specifications, the cached iframe cannot dynamically acquire new permissions.
Expected: When a cached iframe is reused, its allow attribute should match the current permissions configuration. If permissions have changed, either the cache should be invalidated or a new iframe should be created.
Technical context: The bug occurs because:
- The cache is keyed by
tab.nameonly, not considering thepermissionsconfiguration - When retrieving a cached iframe (lines 28-31), the code skips permission setup entirely
- The
allowattribute is only set when creating new iframes (line 33) - Per web standards, the
allowattribute's permissions are evaluated at iframe load time and cannot be updated afterward
atinux
approved these changes
Nov 20, 2025
antfu
approved these changes
Nov 21, 2025
1 task
This was referenced Dec 22, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🔗 Linked issue
resolves #214
related nuxt-hub/core#684
❓ Type of change
Adds ability to pass additional permissions to the iframe when registering a custom tab. Previously they were hard coded in #215.
📚 Description