@argos-ci/cypress 0.0.6 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/README.md +3 -3
  2. package/package.json +1 -1
  3. package/support.js +39 -0
package/README.md CHANGED
@@ -12,9 +12,9 @@ _Argos is a visual testing solution that fits in your workflow to avoid visual r
12
12
  [![npm dm](https://img.shields.io/npm/dm/@argos-ci/cypress.svg)](https://www.npmjs.com/package/@argos-ci/cypress)
13
13
  [![npm dt](https://img.shields.io/npm/dt/@argos-ci/cypress.svg)](https://www.npmjs.com/package/@argos-ci/cypress)
14
14
 
15
- Visit [docs.argos-ci.com/cypress](https://docs.argos-ci.com/cypress) for guides, API and more.
15
+ Visit [argos-ci.com/docs/cypress](https://argos-ci.com/docs/cypress) for guides, API and more.
16
16
 
17
17
  ## Links
18
18
 
19
- - [Official SDK Docs](https://docs.argos-ci.com/)
20
- - [Discord](https://discord.gg/WjzGrQGS4A)
19
+ - [Official SDK Docs](https://argos-ci.com/docs)
20
+ - [Discord](https://argos-ci.com/discord)
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@argos-ci/cypress",
3
3
  "description": "Visual testing solution to avoid visual regression. Cypress commands and utilities for Argos visual testing.",
4
- "version": "0.0.6",
4
+ "version": "0.0.8",
5
5
  "author": "Smooth Code",
6
6
  "license": "MIT",
7
7
  "repository": "github:argos-ci/argos-cypress",
package/support.js CHANGED
@@ -58,6 +58,36 @@ function waitUntilNoBusy() {
58
58
  );
59
59
  }
60
60
 
61
+ /**
62
+ * Wait until all images are loaded.
63
+ */
64
+ function waitForImagesLoading() {
65
+ cy.waitUntil(() =>
66
+ cy.document().then((document) => {
67
+ const allImages = Array.from(document.images);
68
+ allImages.forEach((img) => {
69
+ img.loading = "eager";
70
+ img.decoding = "sync";
71
+ });
72
+ return allImages.every((img) => img.complete && img.naturalWidth > 0);
73
+ })
74
+ );
75
+ }
76
+
77
+ /**
78
+ * Disable spellcheck on inputs, textareas, and contenteditable elements to avoid red underlines
79
+ */
80
+ function disableSpellCheck() {
81
+ cy.document().then((document) => {
82
+ const query =
83
+ "[contenteditable]:not([contenteditable=false]):not([spellcheck=false]), input:not([spellcheck=false]), textarea:not([spellcheck=false])";
84
+ document.querySelectorAll(query).forEach((element) => {
85
+ element.setAttribute("spellcheck", "false");
86
+ });
87
+ });
88
+ return true;
89
+ }
90
+
61
91
  Cypress.Commands.add(
62
92
  "argosScreenshot",
63
93
  { prevSubject: ["optional", "element", "window", "document"] },
@@ -72,13 +102,22 @@ Cypress.Commands.add(
72
102
  displayName: `Argos Screenshot`,
73
103
  message: name,
74
104
  });
105
+
75
106
  // Inject styles
76
107
  cy.document().then((doc) => injectStyles(doc));
108
+
77
109
  // Wait until there is no `[aria-busy="true"]` element on the page.
78
110
  waitUntilNoBusy();
111
+
79
112
  // Wait for fonts to be loaded
80
113
  cy.document().its("fonts.status").should("equal", "loaded");
81
114
 
115
+ // Wait for images to be loaded
116
+ waitForImagesLoading();
117
+
118
+ // Wait for images to be loaded
119
+ disableSpellCheck();
120
+
82
121
  // Screenshot
83
122
  cy.wrap(subject).screenshot(name, {
84
123
  blackout: ['[data-visual-test="blackout"]'].concat(