Description
What problem does this feature solve?
When using Microsofts Offic.js (e.g. in Word: https://docs.microsoft.com/en-us/javascript/api/word?view=word-js-preview), and using Vue with vue router, the router tries using push state, but the office js script deletes the push state since the excel web pane is not supporting the push state. The check in push state wheter push state can be used, checks for window.history && 'pushState' in window.history, but office.js resets the fields on window.history, not window.history itself (see https://stackoverflow.com/a/42703406/). I propose we check if Office.js is available in the context, and if so, we disable the push state.
What does the proposed API look like?
We would add a check at this position:
vue-router/src/util/push-state.js
Line 17 in c0d3376
The additional check could look like this:
const officeJsLoaded = window.Office && window.Office.context;
so the whole function might look like this:
export const supportsPushState =
inBrowser &&
(function () {
const ua = window.navigator.userAgent
const officeJsLoaded = window.Office && window.Office.context
if (
officeJsLoaded ||
((ua.indexOf('Android 2.') !== -1 || ua.indexOf('Android 4.0') !== -1) &&
ua.indexOf('Mobile Safari') !== -1 &&
ua.indexOf('Chrome') === -1 &&
ua.indexOf('Windows Phone') === -1)
) {
return false
}
return window.history && 'pushState' in window.history
})()
Alternatively, we could check if window.history.pushState is null, but I am not sure of the implications of this. Maybe someone who knows the expected state in the browsers can shed a light wheter that would make sense.
This would result in this return statement, the rest of the function not being changed:
return window.history && 'pushState' in window.history && window.history.pushState !== null