JSFiddle - React, Tailwind, and code Playground

testing regular expressions

by jonchius

HTML

<div id="canvas"></div>

CSS

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700');

:not(code) {
    font-family: 'Source Sans Pro', 'Lucida Grande', Verdana
}

.true {
    background: #090;
}

.false {
    background: #900;
}

.true,
.false {
    padding: 20px;
    color: #fff;
}

JavaScript

/* 
[regularx]
testing regular expressions
*/

displayTestCases();

function displayTestCases() {
	
	// enter test cases here
	var testCases = [{
            expression: /[0-5]/,
            meaning: "a number from 0 to 5 inclusive",
            input: "5"
        }, {
            expression: /[0-5]/,
            meaning: "a number from 0 to 5 inclusive",
            input: "6"
        }, {
            expression: /\d/,
            meaning: "contains digits",
            input: "99"
        }, {
            expression: /\d/,
            meaning: "contains digits",
            input: "a"
        }, {
            expression: /([A-Z][a-z])*/,
            meaning: "contains letters",
            input: "a"
        }, {
            expression: /[^01]/,
            meaning: "contains non-binary characters",
            input: "111101"
        }, {
            expression: /[^01]/,
            meaning: "contains non-binary characters",
            input: "1111021"
        }, {
            expression: /colou?r/,
            meaning: "either color or colour",
            input: "color"
        }, {
            expression: /colou?r/,
            meaning: "either color or colour",
            input: "colour"
        }, {
            expression: /\bcat\b/,
            meaning: "match 'cat' as whole word only",
            input: "cat"
        }, {
            expression: /\bcat\b/,
            meaning: "match 'cat' as whole word only",
            input: "catatonic"
        }, {
            expression: /\bcat\b \bposter\b/,
            meaning: "match 'cat poster' as whole words only",
            input: "cat poster"
        }, {
            expression: /\b(cat|dog|fish)\b \bfood\b/,
            meaning: "match 'cat' or 'dog' or 'fish' plus 'food'",
            input: "fish food"
        }, {
            expression: /\bca(r|t)\b/,
            meaning: "match 'car' or 'cat' as whole word only",
            input: "car"
        }, {
            expression:...