theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

workflow(sfc-playground): make it work in safari and ff

Browse Source
This commit is contained in:
Evan You
2021-03-31 15:23:01 -04:00
parent 5ee7e6bc70
commit 4dc457dae5
3 changed files with 51 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
packages/sfc-playground/src/output/srcdoc.html
View File

@@ -8,11 +8,6 @@
}
</style>
<style id="__sfc-styles"></style>
<!-- ES Module Shims: Import maps polyfill for modules browsers without import maps support (all except Chrome 89+) -->
<script async src="https://ga.jspm.io/npm:es-module-shims@0.10.1/dist/es-module-shims.min.js"></script>
<script id="map" type="importmap"><!--IMPORT_MAP--></script>
<script>
(() => {
let scriptEls = []
@@ -55,12 +50,12 @@
scriptEl.setAttribute('type', 'module')
// send ok in the module script to ensure sequential evaluation
// of multiple proxy.eval() calls
const done = new Promise((resolve, reject) => {
const done = new Promise((resolve) => {
window.__next__ = resolve
scriptEl.onerror = reject
})
scriptEl.innerHTML = script + `\nwindow.__next__()`
document.head.appendChild(scriptEl)
scriptEl.onrror = err => send_error(err.message, err.stack)
scriptEls.push(scriptEl)
await done
}
@@ -108,11 +103,27 @@
window.addEventListener('message', handle_message, false);
window.onerror = function (msg, url, lineNo, columnNo, error) {
parent.postMessage({ action: 'error', value: error }, '*');
if (msg.includes('module specifier “vue”')) {
// firefox only error, ignore
return false
}
try {
parent.postMessage({ action: 'error', value: error }, '*');
} catch (e) {
parent.postMessage({ action: 'error', value: msg }, '*');
}
}
window.addEventListener("unhandledrejection", event => {
parent.postMessage({ action: 'unhandledrejection', value: event.reason }, '*');
if (event.reason.message.includes('Cross-origin')) {
event.preventDefault()
return
}
try {
parent.postMessage({ action: 'unhandledrejection', value: event.reason }, '*');
} catch (e) {
parent.postMessage({ action: 'unhandledrejection', value: event.reason.message }, '*');
}
});
let previous = { level: null, args: null };
@@ -121,7 +132,10 @@
const original = console[level];
console[level] = (...args) => {
const msg = String(args[0])
if (msg.includes('You are running a development build of Vue')) {
if (
msg.includes('You are running a development build of Vue') ||
msg.includes('You are running the esm-bundler build of Vue')
) {
return
}
const stringifiedArgs = stringify(args);
@@ -137,7 +151,9 @@
try {
parent.postMessage({ action: 'console', level, args }, '*');
} catch (err) {
parent.postMessage({ action: 'console', level: 'unclonable' }, '*');
parent.postMessage({ action: 'console', level, args: args.map(a => {
return a instanceof Error ? a.message : String(a)
}) }, '*');
}
}
@@ -232,6 +248,10 @@
}
})()
</script>
<!-- ES Module Shims: Import maps polyfill for modules browsers without import maps support (all except Chrome 89+) -->
<script async src="https://unpkg.com/es-module-shims@0.10.1/dist/es-module-shims.js"></script>
<script type="importmap"><!--IMPORT_MAP--></script>
</head>
<body>
<div id="app"></div>