Hi, thank you for the reply. Do you think it is po...
# help
f
Hi, thank you for the reply. Do you think it is possible to add unit tests instead of component testing? if so how?
c
Hey Boghos, can you provide a little more about what you're looking to accomplish or your setup? Cypress doesn't currently have a unit testing framework.
f
Hi, thank you for your help! I appreciate it. I'm finishing my final project for my bachelor in computer science and the project is about using state-of-the-art front end development tools and techniques. My tutor asked me to develop a simple front-end application using BBD through cypress and cucumber feature files. My scientific contribution part would be to add unit tests to that approach such that I have 100% code coverage.
c
Ok cool! Thanks for providing that context. Typically BDD isn't used for unit tests, because BDD is based on user behavior, which is a higher level of abstraction from unit tests, which deal with individual units of code.
You could add unit tests using a unit testing framework like Jest or Mocha, they can live alongside Cypress tests
f
but will they run in the cypress UI like the normal e2e tests?
c
Not if you're using a different framework.
f
I did see that tutorial before, but it did not make sense to me because I am using a different frame work, which is vue js
so the setup was completely different, the folder structure, etc...
c
You could potentially write unit-style tests with Cypress, however that's not it's typical application, because it's meant for testing UIs and not individual blocks of code. Unit testing frameworks allow you to call individual functions and test their output, etc., while Cypress involves interacting with a UI.
f
exactly! but my tutor asked me without him knowing a thing about vue js and cypress
I mean he probably knows a bit about cypress but if I could write unit-style tests I would love to know how. especially if they could run in the UI of cypress
f
alongside e2e
c
That link has some recipes for how it can be done. Not the typical use case for sure, but it's possible.
These tests are down without loading a page, FYI
So they are still not interacting with the UI, because unit tests really wouldn't interact with the UI
f
ah that's perfect! I'll try that and see what happens. yeah about that, do I just run them in the console then?
c
You'd use the
cypress run
command
That will output the results in the console
A few caveats -- I'm not sure if the unit tests will play nice with feature files. They are VERY different approaches to testing. Also, I haven't tried running unit and e2e tests together
So you may have to experiment with how you run them
It may need separate run commands but they could live in the same suite
Hopefully that helps!
f
alright. what about the folder structure difference between the repo you showed me and the one that is created when using vue cli to create a project?
you are being very helpful! I may even quote you in my final report if that's alright with you:)
c
Haha, sure! Always happy to help.
Okay for vue-cli...
they configure Cypress to use /tests/e2e
the example I provided is showing cypress/integration
You can use whichever, you'll just want to make sure that in cypress.json the
integrationFolder
value has the path of whichever you use
f
the repo you showed me has the following file structure
Copy code
cypress
        |
        |__fixtures
        |
        |__integration
while using vue cli it has the following:
Copy code
tests
        |
        |__e2e
        |    |_cucmber-json
        |    |_plugin
        |    |_specs
        |    |    |_ feature files and folders
        |    |_support
        |__unit
c
correct. As long as your folder with the Cypress "unit" tests is inside the e2e folder, they will get picked up by Cypress
I'd keep them separate from the
specs
folder that has the BDD tests
f
emmm the unit test folder is not inside the e2e
they are on the same level inside the folder tests
c
That's because Vue isn't set up to use Cypress for unit tests
f
Exactly!
c
it's leveraging a different framework designed for unit testing
So you'll have to change things around a bit 🙂
f
alright, like changing the method, tool or just the configuration?
because I configure it like this for the e2e tests:``` { "pluginsFile": "tests/e2e/plugins/index.js", "testFiles": "**/*.{feature,features}" }```
c
Yeah, that's where it gets tricky, because the cucumber plugin.
I would say you may need to have a completely separate directory for the 'unit' tests
you may need to play around with it a bit and see what folder structure works best for you
f
yeah that's the reason I've been banging my head against the desk the last two months lol
c
haha, yeah this isn't really a typical use case for Cypress, and the cucumber plugin is third-party and wasn't built by Cypress either
Here's what I'm thinking...
The important thing to keep in mind is that the BDD plugin is a pre-processor, so it's literally taking your feature files and step definitions and then CREATING Cypress code. Which is why it's so difficult to configure.
I would recommend separating the BDD tests and the unit tests, with different cypress.json files so you can define the location of testFiles for the BDD tests and then set the integrationFolder for the 'unit' tests
Then you can define run commands in your package.json or you can pass the a flag at run time to specify which configuration to use
honestly it's going to be complicated
If you can use a real unit testing framework instead of Cypress, your life will be much simpler
f
here's the thing tho, I can run unit tests using the command: npm run test:unit maybe I could reconfigure it so that it uses cypress as well? or I could just use it alone?
I may be able to use a different frame work. but would you know how I could configure the whole project for using both types of tests? or is it the same problem?
c
Its very common to use one framework for integration tests and then another for unit. There should already be pre-existing commands provided by vue-cli to run the different types of tests on the same project.
vue-cli is set up for Cypress and Jest with no configuration needed.
You would just need to make changes to add the BDD plugin for Cypress
f
yes I used that in the beginning. I just had to try and do everything in cypress because of my tutor. but I'll send him an email tonight and tell him someone from cypress literally told me unit testing is impossible/not supported in cypress.
c
Yes!
Not supported is a good way to put it.
You can tell him I said that 😅
Good luck with your project!
f
thank you so much!
can I somehow download and keep this thread for future reference? nvm took screenshots lol
2 Views