chore: add cypress #27

JacobMGEvans · 2020-05-26T05:07:53Z

5/24/20

initial setup, current test assert true is true
next step is creating mock data for fields and utilizing the inputs

5/25/20

Added data-cyp on the suggested query in component QueryAdvise
Added comments to seed file (current unused mostly)
Added two tests for smoke testing app main functionality

5/29/20
dda125b

Updates to ESlint merged
Updates to package.json merged
Change in lock incoming change added with current

72eac23

Fixed Linter Errors -- unused variables

960a767

Tests cover the functionality of query options
Clearing and user input of the code fields
Clicking on the HTML previews
Validating the query option selections change the descriptive content

Update Local

- initial setup, current test assert true is true - next step is creating mock data for fields and utilizing the inputs

…into feature/cypress

- Added data-cyp on suggested query in component QueryAdvise - Added comments to seed file (current unused mostly) - Added two tests for smoke testing app main functionality

smeijer · 2020-05-26T11:58:54Z

Nice! Can you let me know if/when this is ready for review? I'm not sure, because I've noticed that there are a bunch of fixtures committed, that we don't seem to use.

JacobMGEvans · 2020-05-26T13:57:35Z

Yeah, that stuff is auto-generated by cypress, I tried removing it but it seems if to replace it if there isn't something there.
I plan to continue working on this but figured it was a good initial point, so I would say it's ready as a starting point.

smeijer · 2020-05-26T15:40:17Z

Deleting is possible, but requires you to add an empty config file.

Just create an cypress.json in the project root, containing nothing more than {}. Then you can delete those files :)

edit And now I see you already have a config file, in another project of mine, that was the fix. 😕

JacobMGEvans · 2020-05-26T18:30:48Z

Yeah, but I will end up using fixtures soon anyways, this was mostly an initial setup with a smoke test.

- Utilized fixture for constant HTML - Refactored utilizing fixture

- Currently tests rewrite of a demo HTML and then clicks on HTML preview for working button

JacobMGEvans · 2020-05-28T05:45:55Z

@smeijer Updates:

Added fixtures
Refactored
Abstracted reusable functions to support
Improvements to some of the testing (less brittle hopefully)

smeijer · 2020-05-28T14:20:11Z

Thanks 👍 Just wanted to let you know that I've seen it. I need a bit more time for a good check though. I'll come back to this.

JacobMGEvans · 2020-05-29T00:59:22Z

I will have to resolve recent conflicts or someone else can, I am good either way. I won't be able to get to it tonight most likely.

- Updates to ESlint merged - Updates to package.json merged - Change in lock incoming change added with current

JacobMGEvans · 2020-05-30T02:13:56Z

I will have to resolve recent conflicts or someone else can, I am good either way. I won't be able to get to it tonight most likely.

@smeijer I resolved the conflicts 😄

- Tests cover functionality of query options - Clearing and user input of the code fields - Clicking on the HTML previews - Validating the query option selections change the descriptive content

…shouldnt change often

smeijer · 2020-05-30T06:43:31Z

Awesome! Thanks. I'll try to take a look at it this weekend.

MichaelDeBoey · 2020-05-30T10:31:29Z

cypress.json

@@ -0,0 +1,5 @@
+{
+        "baseUrl": "http://localhost:1234",


I think you need to run prettier again here 🤔

Isn't the husky hook running the linting and prettier application wide?

I checked it is not running on Husky hooks and apparently the root files are being ignored by Husky.

JacobMGEvans · 2020-05-30T20:47:25Z

I can definitely work on that next! 😄

JacobMGEvans · 2020-05-30T20:49:37Z

I was definitely waist-deep in Cypress docs and totally forgot about Testing Libs Cypress Library! lmao duh! Thanks for the reminder and suggestion.

JacobMGEvans · 2020-05-30T20:52:16Z

@smeijer Would you like that implemented in this PR before it goes in or as a next milestone for the Cypress integration?

smeijer · 2020-05-30T20:55:54Z

I would prefer to have it in this PR, before we merge.

The codebase is moving quite fast, as the first thing I've shipped was more of a prototype level, than a production-grade thing.

Because of that, a lot of things are changing. ClassNames is one of those things. If we would merge this pull-request in it's current state, I'm sure tests will break all the time.

And then it would slow us down, instead of giving assurance that everything still works as it should be.

JacobMGEvans · 2020-06-10T18:49:25Z

Sorry about the absence, I had to take a break from coding outside of work. I will get back to this soon.

smeijer · 2020-06-10T19:31:03Z

Sure. I completely understand. 😊 Take your time.

smeijer · 2020-10-09T10:14:42Z

Any wise words on what to do with this PR? I would love to have some e2e tests, but I have no Idea how much work it would be to bring this PR to a workable state.

ddehart · 2020-12-02T02:27:20Z

@smeijer I figured I'd take a stab at this as a part of learning more about testing JavaScript, and the markup -- specifically the implementation of codemirror -- makes it challenging to make use of the principles of Testing Library.

Acknowledging that I'm a complete novice, attempting something even as simple as selecting the editor to clear it out and type something as a user would may be impossible without brittle selectors or acrobatics like grabbing parents of parents. I even went so far as trying to use Testing Playground on Testing Playground to identify good selectors without much luck. 😂

Someone with a bunch more Cypress/Testing Library experience can probably find an elegant solution, but I couldn't even really get started without considering class selectors or thinking about injecting a bunch of testids into the markup.

I hope that perspective helps as this moves forward!

smeijer · 2020-12-02T08:49:38Z

Someone with a bunch more Cypress/Testing Library experience can probably find an elegant solution, but I couldn't even really get started without considering class selectors or thinking about injecting a bunch of testids into the markup.

If using testIds or classNames is the only thing that can make this work (easily), then we should do that.

Does that mean that this branch works when we rebase it? We currently don't have many tests, so I'm eager to get this one merged.

ddehart · 2020-12-02T20:26:48Z

If using testIds or classNames is the only thing that can make this work (easily), then we should do that.

How would you feel about having actual ids associated with the editable components? That would make selection easy, potentially less brittle than classnames, and not so specific to a testing framework.

JacobMGEvans · 2020-12-02T20:30:25Z

If using testIds or classNames is the only thing that can make this work (easily), then we should do that.

How would you feel about having actual ids associated with the editable components? That would make selection easy, potentially less brittle than classnames, and not so specific to a testing framework.

I think as long as it's utilizing the https://testing-library.com/docs/cypress-testing-library/intro/ and following the accessibility priority, then IDs necessity should be minimized. I never got around to that, unfortunately.

ddehart · 2020-12-02T20:59:38Z

I think as long as it's utilizing the https://testing-library.com/docs/cypress-testing-library/intro/

Oh, sorry, I was referring specifically to the HTML id attribute as opposed to a custom testid attribute. I'm just curious if HTML ids would be preferred for this project over testids

smeijer · 2020-12-03T08:58:03Z

testIds and id serve the same purpose in this regard. So in that case, I would say that a testId is preferable, as it at least makes its intension clear.

ddehart · 2020-12-06T15:30:39Z

@JacobMGEvans do you plan on rebasing with your changes? If not, I can take a stab at it.

marcosvega91 · 2020-12-06T15:50:36Z

This PR is very old, so I think that is better to start a new PR and copy what @JacobMGEvans has done here in the new one ? What do you think guys?

smeijer · 2020-12-06T15:51:07Z

That's what a rebase does 😊. I'm fine with any solution. I think it's still good to have some tests. So any progress in this area would be awesome.

JacobMGEvans · 2020-12-06T15:52:14Z

@JacobMGEvans do you plan on rebasing with your changes? If not, I can take a stab at it.

You can use this branch if you like or create your own from scratch. I had a lot of the setup done which was most of the pain. I think I needed to add https://testing-library.com/docs/cypress-testing-library/intro/ (CTL)

The current tests were mostly smoke tests, just needed that CTL, however, if you DO do it from scratch keep this in mind because it was a big hurdle with the CodeMirror
https://stackoverflow.com/questions/62012319/how-can-i-clear-a-codemirror-editor-field-from-cypress

JacobMGEvans · 2020-12-06T15:54:40Z

I'll try to update the PR with upstream main, RN

smeijer · 2020-12-06T15:54:52Z

The conflicting files doesn't seem to be much. Does it make sense to resolve the conflict, merge, and improve in a new PR?

JacobMGEvans · 2020-12-06T16:08:43Z

Well, that is odd... The branch and work have disappeared. I know I didn't delete it.

JacobMGEvans · 2020-12-06T16:18:28Z

I will figure this out later.

smeijer · 2020-12-06T16:49:43Z

@JacobMGEvans, can it be because origin has changed in the mean time? It moved from smeijer/testing-playground to testing-library/testing-playground.

JacobMGEvans · 2020-12-06T18:23:07Z

@JacobMGEvans, can it be because origin has changed in the mean time? It moved from smeijer/testing-playground to testing-library/testing-playground.

Very possible 😅 ! The repo was originally forked from that old one. I don't know what the effects would normally be but explains the "unknown repository." I also rebased already and the work might have been develop local I can try to undo that or find the changes in a detached HEAD if not the PR at least has most of the files changes here

smeijer · 2020-12-07T15:21:31Z

Superseded by #313 (comment). Again, I'm very sorry that I haven't merged this sooner.

JacobMGEvans and others added 6 commits May 24, 2020 10:53

Merge pull request #1 from smeijer/master

26c542b

Update Local

Initial Cypress Setup

21d8a82

- initial setup, current test assert true is true - next step is creating mock data for fields and utilizing the inputs

Improved Types, started improving test initial field changes by user

98612f7

Merge branch 'master' of https://github.com/smeijer/testing-playground …

4c0e66d

…into feature/cypress

Cypress tests

1e1a9b0

- Added data-cyp on suggested query in component QueryAdvise - Added comments to seed file (current unused mostly) - Added two tests for smoke testing app main functionality

jest should ignore cypress

3dc7c26

JacobMGEvans added 3 commits May 27, 2020 22:36

Removed unused fixtures

2e32b0d

- Utilized fixture for constant HTML - Refactored utilizing fixture

Renamed files and variables for clarity

33b7a17

Started more in depth tests of whole page functionality

e021d5f

- Currently tests rewrite of a demo HTML and then clicks on HTML preview for working button

smeijer changed the title ~~Feature/cypress~~ feat: add cypress May 28, 2020

smeijer assigned JacobMGEvans May 28, 2020

smeijer mentioned this pull request May 28, 2020

chore: update lint staged #53

Merged

smeijer changed the title ~~feat: add cypress~~ chore: add cypress May 29, 2020

JacobMGEvans added 2 commits May 29, 2020 21:00

Resolved Merge Conflicts

dda125b

- Updates to ESlint merged - Updates to package.json merged - Change in lock incoming change added with current

Fixed Linter Errors -- unused variables

72eac23

JacobMGEvans added 4 commits May 29, 2020 22:29

Naming convention changes for clarity & additional testing

960a767

- Tests cover functionality of query options - Clearing and user input of the code fields - Clicking on the HTML previews - Validating the query option selections change the descriptive content

Fixed Template literals breaking assertions

7e974a6

Added Navigation Tests and fixed name convention

b23c5f2

Added all Navigation to Tests -- Made check more specific URLs since …

ca72229

…shouldnt change often

MichaelDeBoey requested changes May 30, 2020

View reviewed changes

tab spacing changed for JSON for Cypress

c737624

smeijer changed the base branch from master to develop May 31, 2020 12:48

smeijer marked this pull request as draft June 5, 2020 14:25

smeijer marked this pull request as ready for review December 6, 2020 15:53

smeijer marked this pull request as draft December 6, 2020 15:54

ddehart mentioned this pull request Dec 6, 2020

test: add cypress end-to-end test setup #313

Merged

2 tasks

smeijer closed this Dec 7, 2020

chore: add cypress #27

chore: add cypress #27

Conversation

JacobMGEvans commented May 26, 2020 • edited Loading

smeijer commented May 26, 2020 • edited Loading

JacobMGEvans commented May 26, 2020

smeijer commented May 26, 2020 • edited Loading

JacobMGEvans commented May 26, 2020

JacobMGEvans commented May 28, 2020

smeijer commented May 28, 2020

JacobMGEvans commented May 29, 2020

JacobMGEvans commented May 30, 2020

smeijer commented May 30, 2020

MichaelDeBoey May 30, 2020

Choose a reason for hiding this comment

JacobMGEvans May 30, 2020

Choose a reason for hiding this comment

JacobMGEvans May 30, 2020

Choose a reason for hiding this comment

JacobMGEvans commented May 30, 2020

JacobMGEvans commented May 30, 2020 • edited Loading

JacobMGEvans commented May 30, 2020

smeijer commented May 30, 2020

JacobMGEvans commented Jun 10, 2020

smeijer commented Jun 10, 2020

smeijer commented Oct 9, 2020

ddehart commented Dec 2, 2020

smeijer commented Dec 2, 2020

ddehart commented Dec 2, 2020

JacobMGEvans commented Dec 2, 2020

ddehart commented Dec 2, 2020

smeijer commented Dec 3, 2020

ddehart commented Dec 6, 2020

marcosvega91 commented Dec 6, 2020

smeijer commented Dec 6, 2020 • edited Loading

JacobMGEvans commented Dec 6, 2020

JacobMGEvans commented Dec 6, 2020

smeijer commented Dec 6, 2020

JacobMGEvans commented Dec 6, 2020

JacobMGEvans commented Dec 6, 2020

smeijer commented Dec 6, 2020

JacobMGEvans commented Dec 6, 2020

smeijer commented Dec 7, 2020 • edited Loading

JacobMGEvans commented May 26, 2020 •

edited

Loading

smeijer commented May 26, 2020 •

edited

Loading

smeijer commented May 26, 2020 •

edited

Loading

JacobMGEvans commented May 30, 2020 •

edited

Loading

smeijer commented Dec 6, 2020 •

edited

Loading

smeijer commented Dec 7, 2020 •

edited

Loading