test: adding tests (playwright)

[vvidday]

Setup + basic tests using playwright

Currently implements the following (E2E) tests:

Use Case / Feature	Expected Behaviour
Basic typing / editing	Text should update as user types Text should be formatted appropriately when user inputs bold/italics
Converting between types	Blocks should be converted appropriately when user selects a type from the menu Blocks should be converted appropriately when user initiates conversion by searching/typing Caret position should be maintained after conversion if initiated from search
Creating new lines / Breaking lines	Pressing 'Enter' at the end of a block should create a new line Pressing 'Enter' in the middle of a block should create a new line containing the text after the caret position
Merging two lines	Pressing 'Backspace' at the beginning of a text block should merge the current block's content with the previous block Pressing 'Backspace' at the beginning of a non-text block should convert the current block to a text block

I also included an example using playwright's component testing (c9a30f1 and 89329ed), which will be very useful since it allows us to mount components with custom props. (eg if we want to test custom inputs like bold/italic bold/headings etc we can mount the component with these inputs instead of having to create them in an end to end test)

One 'downside' of playwright compared to cypress is that we can't (to my knowledge) access instance methods (for example directly calling Lotion.vue::getCaretPos()), but we can still test the correctness of the methods outcome e.g. by initiating a change in block type via the menu.

Also, I'm not sure regarding CI (I'm not familiar with AWS), currently npx playwright test is configured to start the local server with npm run dev and test on that url - might need some changes for CI.

[greentfrapp]

Hey @vvidday sorry about the long delay!

Thanks again for helping to look into Playwright!

Quick overview:

• We're planning to use vitest for unit and component testing because it's pretty fast and has watch mode built-in already
• Then using Playwright for E2E primarily for browser coverage across Chrome, FF and Safari

Added some comments in the PR review.

I've also set up some very basic tests (unit/component/e2e) in main for reference, see tests folder. Take a look and let me know what you think?

[vvidday]

Skipped the 2 failing tests (on chromium) for now, will address in future PR - see #54 for details