Calling Window.scrollTo() On Android Mobile Browser Causes TypeError: No Function Was Found That Matched The Signature Provided

I have a React Project - I'm attaching an onClick to the Header Navigation Links that scroll to a particular element on the page. I am generating React refs, and using the Y position of the elements to input into a Window.scrollTo() function call.

Here is the code:

class Component extends React.Component {
    constructor(props) {
        this.menuRef = React.createRef()
    }

    scrollToRef(ref, instructions, event, arg2) {
        if (event) event.preventDefault()

        let pageOffSet = 200

            if (this.state.topOfPage) {
                pageOffSet = 200 
            } else if (!this.state.topOfPage) {
                pageOffSet = 150
            }

            window.scrollTo({top: (ref.current.offsetTop - pageOffSet), behavior: "smooth"})
    }

    render(){return(
     // Pseudocode...
    <button onClick={() => this.scrollToRef(this.menunRef, "contact", event)}
    <div ref={this.menuRef}/>
    )}
}

Expected Behavior: Window scrolls down to ref Y coordinates, react state changes according to "instructions" recieved by function (I omitted setState calls) Actual Behavior: Working in most browsers. In default Android browser, I get the following error:

Component Full Code on Github: https://github.com/Mikhail-MM/wsd-dental/blob/master/src/components/TabletSite.js

Working Demo: https://worldsmilesdental.herokuapp.com/

Please help, I am at my wits end trying to debug this. I have no idea how to debug mobile browsers, How can I see the output of console.log() on a mobile safari or android browser?

That’s a new-ish signature for scrollTo, it used to only accept scrollTo( x, y ) but now it can also accept an object. The android browser must not know about the new version. You can use a polyfill to patch it.

if you have a Mac you can debug iOS Safari through desktop Safari: https://appletoolbox.com/2014/05/use-web-inspector-debug-mobile-safari/