MyBB Community Forums - Javascript Issue

Hello, after some update either with MyBB or Chrome itself, my forum started to have issues with javascript. Issue happens only in Chrome. Everything works normally in Firefox and Opera. What's happening is basically I notice javascript parts of my forum "stuttering", refreshing page solves the issue but it starts again after you activate some javascript parts of the site.

For example there's a dropdown menu that works with java, after this issue started you sometimes can't see dropdown texts - sometimes it will appear after you wait, sometimes it won't at all.

The error I got in console is this:

classie.js:38 Uncaught DOMException: Failed to execute 'remove' on 'DOMTokenList': The token provided must not be empty.
at Object.removeClass (...)
at HTMLAnchorElement.<anonymous> (...)

Any idea how do I solve it?

Can't say much not seeing the code what you have in classie.js
This error mostly happens if you have a syntax error prior to the reported line.

Check the class name targets or modifications prior to the line #38
If the classie.js is same as known class helper script then you are targeting to load a class name in a variable which is actually carrying NULL at runtime (class doesn't exist or can't be targeted at current page).

This is my entire classie.js:

/*!
 * classie v1.0.0
 * class helper functions
 * from bonzo https://github.com/ded/bonzo
 * MIT license
 * 
 * classie.has( elem, 'my-class' ) -> true/false
 * classie.add( elem, 'my-new-class' )
 * classie.remove( elem, 'my-unwanted-class' )
 * classie.toggle( elem, 'my-class' )
 */

/*jshint browser: true, strict: true, undef: true, unused: true */
/*global define: false */

( function( window ) {

'use strict';

// class helper functions from bonzo https://github.com/ded/bonzo

function classReg( className ) {
  return new RegExp("(^|\\s+)" + className + "(\\s+|$)");
}

// classList support for class management
// altho to be fair, the api sucks because it won't accept multiple classes at once
var hasClass, addClass, removeClass;

if ( 'classList' in document.documentElement ) {
  hasClass = function( elem, c ) {
    return elem.classList.contains( c );
  };
  addClass = function( elem, c ) {
    elem.classList.add( c );
  };
  removeClass = function( elem, c ) {
    elem.classList.remove( c );
  };
}
else {
  hasClass = function( elem, c ) {
    return classReg( c ).test( elem.className );
  };
  addClass = function( elem, c ) {
    if ( !hasClass( elem, c ) ) {
      elem.className = elem.className + ' ' + c;
    }
  };
  removeClass = function( elem, c ) {
    elem.className = elem.className.replace( classReg( c ), ' ' );
  };
}

function toggleClass( elem, c ) {
  var fn = hasClass( elem, c ) ? removeClass : addClass;
  fn( elem, c );
}

var classie = {
  // full names
  hasClass: hasClass,
  addClass: addClass,
  removeClass: removeClass,
  toggleClass: toggleClass,
  // short names
  has: hasClass,
  add: addClass,
  remove: removeClass,
  toggle: toggleClass
};

// transport
if ( typeof define === 'function' && define.amd ) {
  // AMD
  define( classie );
} else {
  // browser global
  window.classie = classie;
}

})( window );

This is the 37-38-39 part:

  removeClass = function( elem, c ) {
    elem.classList.remove( c );
  };

It might be showing this only because I am reproducing the error in console only when I want to close search panel that appears with javascript. The issue happens in other parts (dropdown menus etc.) aswell, but I can't get error msg with them in console.

As I said check if there is actually an element with the class name what you want to remove.
You need to find out from where this removeClass function is being called.

I have another theme related .js file with 24 instances of "removeClass", if that's what you asked.

I don't know much about javascript codes, so I really don't know what should I look for. But I know that I didn't change anything in these files - and this issue started recently.

In Mozilla this issue doesn't exist. Everything works perfectly. I suspect some changes within the Chrome update causing this.

Anyone have any idea? As I said it's only happening in Chrome, it works perfectly in Firefox.

This is an entirely helpless post so you may dismiss it.

As you've posted:

(2019-09-02, 11:11 AM)Darkrad Wrote: [ -> ]This is my entire classie.js:
(...)

, and..

(2019-09-10, 05:38 PM)Darkrad Wrote: [ -> ]Anyone have any idea? As I said it's only happening in Chrome, it works perfectly in Firefox.

This is really an off-topic thread that is not MyBB's concerns, since you're asking a common question regarding problems/issues of JavaScript which is not specific to MyBB's usage. The search engine might be the best place for solving your problem, or you will want to post your problem in General Discussion & Web Development and Administration for help.

However, you'd like to name the theme/template/plugin if you're not using the MyBB's default one or using a plugin that causes you troubles, or contact the theme/plugin author for help. It'll be extremely helpful if you can include all the context of that piece of code, just like what @effone has said.