Unit tests

[ulyssear]

• Simple class:
  background-color-[yellow] applies background-color: yellow.

• Multiple classes:
  “background-[black] color-[white]” applies background: black; color: white.

• Simple class with event
  “blur:color-[purple]” applies color: purple for “blur” event.

• Multiple events with simple class
  “mouseenter:text-decoration-[underline] mouseleave:text-decoration-[none]” applies text-decoration: underline and text-decoration: none respectively for the “mouseenter” and “mouseleave” events.

• Multiple classe with event:
  “mouseover:{transition-[1s] background-[gainsboro]} applies transition: 1s;background: gainsboro for the “mouseover” event.

• Simple class with selector:
  “[a]:text-decoration-[none]” applies text-decoration: none to the elements matching the selector “a”

• Multiple classes with selector:
  “[a]:{text-decoration-[none] color-[black]” applies text-decoration: none; color: black to the elements matching the selector “a”.

• Simple class with event and selector:
  “blur:[a]:color-[purple]” applies color: purple to the elements matching the selector “a” on “blur” event.

• Multiple classes with event and selector
  “blur:[a]:{transition-[1s] color-[purple]}” applies transition: 1s; color: purple to the elements matching the selector “a” on “blur” event.

• Multiple events with simple class:
  “{blur,click}:color-[purple]” applies color: purple for “blur” and “click” events.

• Multiple events with multiple classes:
  “{blur,click}:{transition-[1s] color-[purple]}” applies color: purple for “blur” and “click” events.

• No class after rendering the document:
  “{blur,click}:{transition-[1s] color-[purple]}” applies color: purple for “blur” and “click” events and there is no class “{blur,click}:{transition-[1s] color-[purple]}”.