I have a good understanding of using jasmine karma for unit tests and testing a particular component's public api, html template by mocking external dependencies like components and services.
I came across cypress component testing for angular. I am not able to comprehend what does this do new compared to jasmine karma tests? Are there any advantages or are they used for different things?
Do we mock child components in component testing? I found some resources like https://github.com/cypress-io/cypress/discussions/17239 but there don't seem to be any definite answers.
Depends on what you are testing. My summary would be
Cypress runs in a real browser which is closer to the user experience. If just unit testing, do you run the risk of not catching an issue because Jasmine isn't using the browser?
You can cover CSS if you mount with CSS modules. Can do the same with Jasmine? Not sure, but even so I don't think Jasmine includes a CSS engine (as the browser does). You can test the result of CSS applied to the HTML. For example, visibility checks, action-ability checks.
Coverage is greater per test. Don't mock the children (unless there is a problem that forces you) then you cover child elements in the parent test.
The Cypress tool-set is broader, and range of plugins is greater.
The component can be allowed to access the API or the network can be mocked easily with
cy.interceptTests are constructed the way a user interacts, not the method input/output style used in unit tests.