TypeError: Cannot read properties of undefined (reading 'hasClass') in wp-auth-check.min.js

[mowsteadily]

This was first reported here https://core.trac.wordpress.org/ticket/59355, but I'm unable to tag a comment there with 6.9.4, so creating a new ticket.

wp-auth-check.min.js?ver=6.9.4:2 Uncaught TypeError: Cannot read properties of undefined (reading 'hasClass')
    at HTMLDocument.<anonymous> (wp-auth-check.min.js?ver=6.9.4:2:655)
    at HTMLDocument.dispatch (jquery.min.js?ver=3.7.1:2:40035)
    at v.handle (jquery.min.js?ver=3.7.1:2:38006)
    at Object.trigger (jquery.min.js?ver=3.7.1:2:70124)
    at HTMLDocument.<anonymous> (jquery.min.js?ver=3.7.1:2:70726)
    at ce.each (jquery.min.js?ver=3.7.1:2:3129)
    at e.<computed>.each (jquery.min.js?ver=3.7.1:2:1594)
    at e.<computed>.trigger (jquery.min.js?ver=3.7.1:2:70701)
    at Object.<anonymous> (heartbeat.min.js?ver=6.9.4:2:2186)
    at c (jquery.min.js?ver=3.7.1:2:25304)

I'm seeing this error on multiple sites, specifically on wp-admin/edit.php pages for posts and cpts. It's difficult to reliably reproduce - on our sites it does seem to be dependent on "The Events Calendar" being active, but it doesn't occur on a demo site with just the Events Calendar, and it also doesn't occur when the sites are cloned to a local development environment (frustrating!) so it may also depend on database and server setup.

It's also fixed by having the "Enable jQuery Migrate Helper" plugin active, as suggested by ​this post from someone else experiencing the issue, but that plugin isn't logging any migrate errors so not sure what it is that's fixing it. Toggling CONCATENATE_SCRIPTS and SCRIPT_DEBUG doesn't affect the error.

Currently we're not seeing this blocking downstream javascript functionality, but the posts I've linked to do report issues with that.

On looking at the code triggering the error, I do think it's a bug in core that's exposed by particular circumstances, not completely created by bugs in 3rd party plugins.

The issue is this block of code in wp-includes/js/wp-auth-check.js

	/**
	 * Binds to the Heartbeat Tick event.
	 *
	 * - Shows the authentication form popup if user is not logged in.
	 * - Hides the authentication form popup if it is already visible and user is
	 *   logged in.
	 *
	 * @ignore
	 *
	 * @since 3.6.0
	 *
	 * @param {Object} e The heartbeat-tick event that has been triggered.
	 * @param {Object} data Response data.
	 */
	$( function() {

		/**
		 * Hides the authentication form popup when the close icon is clicked.
		 *
		 * @ignore
		 *
		 * @since 3.6.0
		 */
		wrap = $( '#wp-auth-check-wrap' );
		wrap.find( '.wp-auth-check-close' ).on( 'click', function() {
			hide();
			setShowTimeout();
		});
	}).on( 'heartbeat-tick.wp-auth-check', function( e, data ) {
		if ( 'wp-auth-check' in data ) {
			if ( ! data['wp-auth-check'] && wrap.hasClass( 'hidden' ) && ! tempHidden ) {
				show();
			} else if ( data['wp-auth-check'] && ! wrap.hasClass( 'hidden' ) ) {
				hide();
			}
		}
	});

In some circumstances (maybe slower loading, or order of loading of scripts in the admin footer, or something weird with one of the scripts on the footer?), the lines of code hooked to heartbeat-tick.wp-auth-check execute before the lines defining the wrap variable, so we get an error. On subsequent executions of heartbeat-tick.wp-auth-check there's no error since the variable is now defined.

Regardless of what's causing it, since we can't be 100% sure of the order of execution, it seems incorrect for the heartbeat-tick.wp-auth-check-attached block to be relying on those first lines for definition of a variable.

This function should probably be something like:

	$( function() {
		$( '#wp-auth-check-wrap .wp-auth-check-close' ).on( 'click', function() {
			hide();
			setShowTimeout();
		});
	}).on( 'heartbeat-tick.wp-auth-check', function( e, data ) {
		if ( 'wp-auth-check' in data ) {
			wrap = $( '#wp-auth-check-wrap' );
			if ( ! data['wp-auth-check'] && wrap.hasClass( 'hidden' ) && ! tempHidden ) {
				show();
			} else if ( data['wp-auth-check'] && ! wrap.hasClass( 'hidden' ) ) {
				hide();
			}
		}
	});

If I manually edit the site version of wp-includes/js/wp-auth-check.min.js to the above the error no longer occurs.

[siliconforks]

This might be a duplicate of #64403.

[mowsteadily]

Duplicate of #64403.

Thanks @siliconforks - looks like the same issue, hopefully we'll see your fix in 7.0