judocss/spec/classRegex.spec.js

The functional CSS toolkit designed for minimal effort and maximum efficiency.

const classRegex = require('../judo.classRegex');

describe("matching class names with regular expressions", () => {

	it("matches a static class name", () => {
		const regex = classRegex("flex")
		expect(regex.test("flex")).toBe(true)
	})

	it("matches a class name with variable arguments", () => {
		const regex = classRegex("flex-$n")
		expect(regex.test("flex")).toBe(false)
		expect(regex.test("flex-1")).toBe(true)
	})

	it("captures arguments", () => {
		const regex = classRegex("margin-$y-$x")
		const args = regex.exec("margin-2-1").slice(1)
		expect(args.length).toEqual(2)
		expect(args[0]).toEqual("2")
		expect(args[1]).toEqual("1")
	})

	it("allow special character '#' in a class name", () => {
		const args = classRegex("color-$x").exec("color-#666").slice(1)
		expect(args.length).toEqual(1)
		expect(args[0]).toEqual("#666")
	})

	it("allow special character '.' in a class name", () => {
		const args = classRegex("font-size-$x").exec("font-size-2.1em").slice(1)
		expect(args.length).toEqual(1)
		expect(args[0]).toEqual("2.1em")
	})

	it("allow special character '%' in a class name", () => {
		const args = classRegex("radius-$x").exec("radius-50%").slice(1)
		expect(args.length).toEqual(1)
		expect(args[0]).toEqual("50%")
	})

	it("allows hyphenated arguments", () => {
		const args = classRegex("display-$x").exec("display-inline-block").slice(1)
		expect(args.length).toEqual(1)
		expect(args[0]).toEqual("inline-block")
	})

	it("allows a trailing asterisk", () => {
		const args = classRegex("display-$x").exec("display-inline-block*").slice(1)
		expect(args.length).toEqual(1)
		expect(args[0]).toEqual("inline-block")
	})
	
})