bonartm / quizdown-js

Markdown syntax for generating interactive quizzes in the browser
https://bonartm.github.io/quizdown-live-editor/
MIT License
88 stars 24 forks source link

Add unit tests #13

Open bonartm opened 3 years ago

bonartm commented 3 years ago

I'm not familiar with unit testing for typescript/ svelte projects but this projects needs some proper testing. I'm thankful for any examples and first implementations!

kheitkamp commented 2 years ago

Hi Malte, I've created a unit test for the Button component. If you would give me the proper rights, I could push it into a new branch called issue13_add_unit_tests

kheitkamp commented 2 years ago

I used the following tutorial: https://testing-library.com/docs/svelte-testing-library/intro

I had to add the following packages to the package.json to make the tutorial work: "@testing-library/jest-dom": "^5.16.1", "@testing-library/svelte": "^3.0.3",

I also needed to add the following comment at the top of the test file: /**

Jest-dom is described here: https://github.com/testing-library/jest-dom#usage

You'll find an overview of testing queries here: https://testing-library.com/docs/queries/byrole/

kheitkamp commented 2 years ago

I've created a new fork and added the changes there in the main branch.

kheitkamp commented 2 years ago

For better unit testing I would recommend to break the quiz.ts file into a module which imports all the classes currently included in the quiz.ts file. Like with java, where every class has it's own file. It will make your code much more readable and force you to give your classes a clear structure and interdependency while preventing your code to become spaghetti ;-) Also there are a lot of loose functions within the quiz.ts file which mostly seem to be methods that belong to the BaseQuestion class and therefore should be part of it. Quiz just seems to need a bit clean up ;-) Also I would put each type declaration into its own model file which then should be imported by each class that needs it. Drawing a UML class diagram could be very helpful for structuring the classes: https://www.tutorialspoint.com/uml/uml_class_diagram.htm Typescript has a very detailed documentation of how to summarise different classes into one module: https://www.typescriptlang.org/docs/handbook/modules.html

bonartm commented 2 years ago

Thanks a lot, Kristian, for your work and suggestions. I will look into it in the upcoming weeks.