mirror of
https://github.com/zhw2590582/ArtPlayer.git
synced 2026-10-08 19:06:15 -08:00
40 lines
2.6 KiB
JavaScript
40 lines
2.6 KiB
JavaScript
/* global Artplayer, artplayerPluginChapter */
|
|
document.querySelector('#run').onclick = async () => {
|
|
const report = { kind: 'ssr', environment: { userAgent: navigator.userAgent, language: navigator.language }, scripts: [...document.scripts].map(script => new URL(script.src).pathname), checks: [], errors: [], unhandled: [] }
|
|
const check = (id, passed) => { report.checks.push({ id, passed: Boolean(passed) }); if (!passed) throw new Error(id) }
|
|
const onError = event => report.errors.push(event.message)
|
|
const onUnhandled = event => report.unhandled.push(String(event.reason))
|
|
addEventListener('error', onError)
|
|
addEventListener('unhandledrejection', onUnhandled)
|
|
let art
|
|
try {
|
|
const container = document.querySelector('.player')
|
|
container.innerHTML = Artplayer.html
|
|
const player = container.querySelector('.art-video-player')
|
|
const video = container.querySelector('.art-video')
|
|
player.dataset.serverMarker = 'preserved'
|
|
art = new Artplayer({ container, url: '/assets/sample/video.mp4', useSSR: true, muted: true, plugins: [artplayerPluginChapter({})] })
|
|
check('SSR.browser-reuses-player', art.template.$player === player && player.dataset.serverMarker === 'preserved')
|
|
check('SSR.browser-reuses-video', art.video === video && container.querySelectorAll('.art-video-player').length === 1)
|
|
await new Promise((resolve, reject) => {
|
|
const timer = setTimeout(() => reject(new Error('SSR ready timeout')), 10000)
|
|
art.once('ready', () => { clearTimeout(timer); resolve() })
|
|
})
|
|
check('SSR.browser-ready', art.isReady && video.videoWidth > 0 && video.duration > 0)
|
|
check('SSR.browser-plugin', art.plugins.artplayerPluginChapter.name === 'artplayerPluginChapter')
|
|
report.observations = { videoWidth: video.videoWidth, duration: video.duration, serverMarker: player.dataset.serverMarker }
|
|
art.destroy()
|
|
check('SSR.browser-cleanup', container.children.length === 0 && Artplayer.instances.length === 0)
|
|
}
|
|
catch (error) { report.errors.push(error.message) }
|
|
finally {
|
|
if (art && Artplayer.instances.includes(art)) art.destroy()
|
|
removeEventListener('error', onError)
|
|
removeEventListener('unhandledrejection', onUnhandled)
|
|
}
|
|
document.querySelector('#result').textContent = JSON.stringify(report, null, 2)
|
|
const response = await fetch('/reports/ssr', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(report) })
|
|
document.querySelector('#status').textContent = response.ok ? `Saved ${report.checks.length} checks; errors ${report.errors.length}` : 'Save failed'
|
|
document.querySelector('#run').disabled = true
|
|
}
|