SharePoint Online/2019 javascript/spfx click/popstate not working

Are you working with SharePoint 2019?

Maybe making some SPFx Extensions? 

popstate not working? 

click not working? 

MutationObserver not working? 


well, take a look at this


As you can see, Microsoft are intercepting every click in the page, while stopping any bubbling.

Therefor, any window/document/body onclick event will not work, in case you are trying to globally catch it.

Same for popstate or MutationObserver.

*Note - on SPO it seems that popstate event works.


Solution - make an interval to keep watching href change:

let xPrevLocation = location.href
let xOnLocationChangeFunctions = []
setInterval(()=>{
    if (location.href != xPrevLocation){
        console.log("interval location change"xPrevLocationlocation.href)
        xPrevLocation = location.href
        for (let i=0i<xOnLocationChangeFunctions.lengthi++){
            xOnLocationChangeFunctions[i]();
        }
    }
}, 350)

Usage:

window['xOnLocationChangeFunctions'].push(()=>{
   //code...
})


My Scenario:

I've added some scripts via Extension, but when user changed a page, I needed to re-run those scripts, like page load/ready. 

*Note - this is not really page load/ready, just a notification that the page has changed location


Upgrade - run it aslo 1st time, so that xOnLocationChangeFunctions can be used for 1st time also


let xPrevLocation = location.href
let xOnLocationChangeFunctions = []
let xIsFirstLoad = true;

setInterval(()=>{
    if (location.href != xPrevLocation){
        console.log("interval location change"xPrevLocationlocation.href)
        xPrevLocation = location.href
        for (let i=0i<xOnLocationChangeFunctions.lengthi++){
            xOnLocationChangeFunctions[i]();
        }
    }

    if(xIsFirstLoad == true){
        xIsFirstLoad == false
        for (let i=0i<xOnLocationChangeFunctions.lengthi++){
            xOnLocationChangeFunctions[i]();
        }
    }
}, 350)







Comments

Post a Comment

Popular posts from this blog

OverTheWire[.com] Natas Walkthrough - JUST HINT, NO SPOILERS

Asp.Net Ending Response options, Response.End() vs CompleteRequest()

SOLVED The item could not be indexed successfully because the item failed in the indexing subsystem