JSFiddle - React, Tailwind, and code Playground

by kanapkazpasztetem

HTML

<strong>Open console!<br></strong>
<p class="counter">comment $.error in line 6</p>

<br><br>
<button type="button" class="click-btn">Click me!</button>
<p class="click-count">comment $.error in line 32</p>

<p class="lorem">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent tincidunt varius lorem, et auctor tortor congue non.
</p>

JavaScript

$( document ).ready( function() {
	console.log( 'document ready ');
	setTimeout( ipsum, 0 ); // this will be executed after
	var i = 0, j = 0;

	$.error( 'this WILL everything below but not run of the ipsum() function' );
	
	$( '.counter' ).empty();
	try {
		setInterval( function(){
			$( '.counter' ).empty();
			$( '.counter' ).append( ++i );
			randomColor( '.counter' );

			// if you wont comment $.error in randomColor then code below wont be reached
			console.log( i );
			if ( i % 2 === 0 ) {
				$.error( 'even number!' );
			}
			else{
				$.error( 'odd number! ');
			}
		}, 1000 );
		console.log( 'interval initialized' );	
	}
	catch( error ){
		// this will NOT catch errors from inside intervals
		console.log( error );
		// try to change this code so errors from inside interval will be caught
	}

	$.error( 'this won\'t stop interval but will stop click event listener' ); // because it was already initialized
	
	$( '.click-count' ).empty();
	try{
		$( '.click-btn' ).click( function(){
			$( '.click-count' ).empty();
			$( '.click-count' ).append( ++j );
			randomColor( '.click-count' );
		});
		console.log( 'click event initialized' );	
	}
	catch( error ){
		// this will NOT catch errors from inside .click()
		console.log( error );
		// try to change this code so errors from inside click() will be caught
	}

	$.error( 'this won\'t stop interval nor the click event listener' ); // because they were already initialized

	randomColor( '.counter' );
	console.log( 'end of document ready' ); // comment $.error inside to run this code 
});

function randomColor( element ){
   $( element ).each( function(){ 
    var 
    	colorR = Math.floor( 128 + 2 * ( Math.random() * 64 ) ),
    	colorG = Math.floor( 128 + 2 * ( Math.random() * 64 ) ),
    	colorB = Math.floor( 128 + 2 * ( Math.random() * 64 ) );
    $( this ).css( "background-color", "rgb(" + colorR + "," + colorG + "," + colorB + ")" );
  });

	$.error( 'this also won\'t stop interval or click from rerunning...