Not SPA router friendly, even in history mode

[patarapolw]

I have tried deploying on Nuxt. With a little tweaking, it works, but it throws Error on route change, except for the first route.

Tweak --

const remark_config = {
  host: 'https://remark.polv.cc', // hostname of remark server, same as REMARK_URL in backend config, e.g. "https://demo.remark42.com"
  site_id: 'polv',
  components: ['embed'], 
  locale: 'en', // set up locale and language, if it isn't defined default value ('en') will be used,
  init() {
    ;(function(c) {
      for (let i = 0; i < c.length; i++) {
        const d = document
        const s = d.createElement('script')
        s.className = 'remark42-script'
        s.src = remark_config.host + '/web/' + c[i] + '.js'
        s.defer = true
        ;(d.head || d.body).appendChild(s)
      }
    })(remark_config.components || ['embed'])
  },
  remove() {
    document.querySelectorAll('iframe[title=Remark42]').forEach((el) => {
      el.remove()
    })
    document.querySelectorAll('script.remark42-script').forEach((el) => {
      el.remove()
    })
  }
}
window.remark_config = remark_config

Error,

Uncaught TypeError: Cannot read property 'postMessage' of null
    at l (embed.js:1)
    at MutationObserver.<anonymous> (embed.js:1)
l @ embed.js:1
(anonymous) @ embed.js:1
childList (async)
updateTitle @ vue-meta.esm.browser.js?2fd6:1065
updateClientMetaInfo @ vue-meta.esm.browser.js?2fd6:1260
refresh @ vue-meta.esm.browser.js?2fd6:1437
refresh$1 @ vue-meta.esm.browser.js?2fd6:1504
eval @ vue-meta.esm.browser.js?2fd6:169
eval @ vue-meta.esm.browser.js?2fd6:191
setTimeout (async)
batchUpdate @ vue-meta.esm.browser.js?2fd6:190
triggerUpdate @ vue-meta.esm.browser.js?2fd6:168
eval @ vue-meta.esm.browser.js?2fd6:477
setInterval (async)
eval @ vue-meta.esm.browser.js?2fd6:470
eval @ vue.runtime.esm.js?2b0e:1980
flushCallbacks @ vue.runtime.esm.js?2b0e:1906
Promise.then (async)
timerFunc @ vue.runtime.esm.js?2b0e:1933
nextTick @ vue.runtime.esm.js?2b0e:1990
Vue.$nextTick @ vue.runtime.esm.js?2b0e:3521
eval @ vue-meta.esm.browser.js?2fd6:463
invokeWithErrorHandling @ vue.runtime.esm.js?2b0e:1854
Vue.$emit @ vue.runtime.esm.js?2b0e:3888
callHook @ vue.runtime.esm.js?2b0e:4223
Vue.$destroy @ vue.runtime.esm.js?2b0e:4003
destroy @ vue.runtime.esm.js?2b0e:3159
invokeDestroyHook @ vue.runtime.esm.js?2b0e:6114
removeVnodes @ vue.runtime.esm.js?2b0e:6130
patch @ vue.runtime.esm.js?2b0e:6558
Vue._update @ vue.runtime.esm.js?2b0e:3948
updateComponent @ vue.runtime.esm.js?2b0e:4060
get @ vue.runtime.esm.js?2b0e:4479
run @ vue.runtime.esm.js?2b0e:4554
flushSchedulerQueue @ vue.runtime.esm.js?2b0e:4310
eval @ vue.runtime.esm.js?2b0e:1980
flushCallbacks @ vue.runtime.esm.js?2b0e:1906
Promise.then (async)
timerFunc @ vue.runtime.esm.js?2b0e:1933
nextTick @ vue.runtime.esm.js?2b0e:1990
queueWatcher @ vue.runtime.esm.js?2b0e:4402
update @ vue.runtime.esm.js?2b0e:4544
notify @ vue.runtime.esm.js?2b0e:730
reactiveSetter @ vue.runtime.esm.js?2b0e:1055
proxySetter @ vue.runtime.esm.js?2b0e:4631
finish @ nuxt-loading.vue?45c0:76
_callee4$ @ client.js?06a0:468
tryCatch @ runtime.js?96cf:45
invoke @ runtime.js?96cf:274
prototype.<computed> @ runtime.js?96cf:97
asyncGeneratorStep @ asyncToGenerator.js?1da1:3
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
eval @ asyncToGenerator.js?1da1:32
eval @ asyncToGenerator.js?1da1:21
render @ client.js?06a0:250
iterator @ vue-router.esm.js?8c4f:2169
step @ vue-router.esm.js?8c4f:1895
eval @ vue-router.esm.js?8c4f:1896
eval @ vue-router.esm.js?8c4f:2188
_callee3$ @ client.js?06a0:171
tryCatch @ runtime.js?96cf:45
invoke @ runtime.js?96cf:274
prototype.<computed> @ runtime.js?96cf:97
asyncGeneratorStep @ asyncToGenerator.js?1da1:3
_next @ asyncToGenerator.js?1da1:25
Promise.then (async)
asyncGeneratorStep @ asyncToGenerator.js?1da1:13
_next @ asyncToGenerator.js?1da1:25
eval @ asyncToGenerator.js?1da1:32
eval @ asyncToGenerator.js?1da1:21
loadAsyncComponents @ client.js?06a0:134
iterator @ vue-router.esm.js?8c4f:2169
step @ vue-router.esm.js?8c4f:1895
step @ vue-router.esm.js?8c4f:1899
runQueue @ vue-router.esm.js?8c4f:1903
confirmTransition @ vue-router.esm.js?8c4f:2196
transitionTo @ vue-router.esm.js?8c4f:2083
eval @ vue-router.esm.js?8c4f:2393

[umputun]

@Mavrin @akosourov - need your expert opinion. Obviously I have no clue what Nuxt is and if we even expected to support such configurations.

[Mavrin]

I think, it is good idea to provide some api for SPA. But I need time to think about it.

[Ivanezko]

Any updates on this issue?

[paskal]

It looks like the issue is resolved in two linked MRs. Feel free to comment or create new issues if the problem persists.