-
Notifications
You must be signed in to change notification settings - Fork 61
feat(console): improve extension plugin loading robustness #840
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Changes from 5 commits
104bd53
159d481
c4257c3
b974c0a
8f71c22
08378a1
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,12 +1,17 @@ | ||
| <script setup lang="ts"> | ||
| import { ref } from 'vue' | ||
| import { API } from './net'; | ||
| import { useI18n } from 'vue-i18n' | ||
| import { API } from './net' | ||
| import { Cache } from './cache' | ||
|
|
||
| interface Props { | ||
| name: string | ||
| } | ||
| const props = defineProps<Props>() | ||
| const loading = ref(true) | ||
|
|
||
| // Prepare i18n for plugin context | ||
| const { t, locale } = useI18n() | ||
| const loadPlugin = async (): Promise<void> => { | ||
| try { | ||
| API.GetPageOfCSS(props.name, (d) => { | ||
|
|
@@ -21,16 +26,41 @@ const loadPlugin = async (): Promise<void> => { | |
| script.textContent = d.message; | ||
| document.head.appendChild(script); | ||
|
|
||
| const plugin = window.ATestPlugin; | ||
|
|
||
| if (plugin && plugin.mount) { | ||
| console.log('extension load success'); | ||
| const container = document.getElementById("plugin-container"); | ||
| if (container) { | ||
| container.innerHTML = ''; // Clear previous content | ||
| plugin.mount(container); | ||
| // Implement retry mechanism with exponential backoff and context handover | ||
| const checkPluginLoad = (retries = 0, maxRetries = 10) => { | ||
| const globalScope = globalThis as { | ||
| ATestPlugin?: { mount?: (el: Element, context?: unknown) => void } | ||
| }; | ||
| const plugin = globalScope.ATestPlugin; | ||
|
|
||
| if (plugin && typeof plugin.mount === 'function') { | ||
| console.log('extension load success'); | ||
| const container = document.getElementById('plugin-container'); | ||
| if (container) { | ||
| container.innerHTML = ''; | ||
|
|
||
| const context = { | ||
| i18n: { t, locale }, | ||
| API, | ||
| Cache | ||
| }; | ||
|
|
||
| try { | ||
| plugin.mount(container, context); | ||
|
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 已有的插件只有一个参数,这样会导致不兼容。另外 i18n 应该是在插件里实现。不可能把所有插件的 i18n 都写在 core 里。 There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. 收到这个问题! |
||
| } catch (error) { | ||
| console.error('extension mount error:', error); | ||
| } | ||
| } | ||
| loading.value = false; | ||
| } else if (retries < maxRetries) { | ||
| const delay = 50 + retries * 50; | ||
| setTimeout(() => checkPluginLoad(retries + 1, maxRetries), delay); | ||
| } else { | ||
| loading.value = false; | ||
| } | ||
| } | ||
| }; | ||
|
|
||
| checkPluginLoad(); | ||
| }); | ||
| } catch (error) { | ||
| console.log(`extension load error: ${(error as Error).message}`) | ||
|
|
||
Uh oh!
There was an error while loading. Please reload this page.