XF 2.2 Toggle form in mobile view not working

[FoxSecrets]

I implemented a toggle form, it works on desktop view but not in mobile view.

I can see the function working in mobile view however do not toggle the form.

Is there any special setup to run javascript in Xenforo mobile view?

  function toggleForm(event) {
    var form = document.getElementById('search-form');
    form.classList.toggle('hidden-form');
    console.log(form.classList);
  }

<div class="block-container">
    <div onclick="toggleForm()" id="toggleButton">
      <h3 class="block-header">{{ phrase('search') }}</h3>
    </div>

    <xf:form action="{{ link('xxxxx') }}" id="search-form" class="block hidden-form">
      My form
    </xf:form>
  </div>

.hidden-form {
    display: none;
}

 

[FoxSecrets]

Any suggestion?

 

[Jeremy P]

Nothing special for mobile is required. The JS isn't exactly idiomatic to XF but I don't see at a glance why there would be a discrepancy. You might want to try using remote debugging tools.

 

[FoxSecrets]

What kind of tools for example? I see no errors even in log.

 

[Jeremy P]

The console log? There are tools which will let you attach your browser's developer tools to a remote session.

How to Debug Websites on iPhone Safari | BrowserStack

Learn how to debug websites on iPhone Safari using tools like Web Inspector and BrowserStack to ensure smooth performance and fix device-specific issues.

www.browserstack.com

Remote debug Android devices | Chrome DevTools | Chrome for Developers

Remote debug live content on an Android device from a Windows, Mac, or Linux computer.

developer.chrome.com