fixed should(Not)SeeTextAt actions in the tests

features/config.js

@@ -1,8 +1,8 @@
 module.exports = {
     port: 8989,
 
-    headless: false,
+    //headless: false,
     slowMo: 0,
 
-    //close: true,
+    close: true,
 };

features/feedback.feature

@@ -116,4 +116,4 @@ Feature: Leave a feedback
         * button "Send" at "Feedback form" is enabled
 
         # reCaptcha badge replacement warning
-        * see "This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply." at "Feedback form"
+        * see "This site is protected by invisible reCAPTCHA and the Google Privacy Policy and Terms of Service apply." at "Feedback form"

features/support/actions.js

@@ -143,7 +143,7 @@ const modalClosed = async text => {
 
 const shouldSeeText = async text => {
     const { page } = scope.context;
-    const content = await page.content();
+    const content = String(await page.$eval('*', el => el.innerText)).replace(/[\t\s\n\r]+/g, ' ');
     if (!content.includes(text))
         throw new Error(
             `Expected page to contain text: ${text}, but page contains only: ${content}`
@@ -152,18 +152,22 @@ const shouldSeeText = async text => {
 
 const shouldSeeTextAt = async (text, wrapper) => {
     const { page } = scope.context;
-    const [el] = await page.$x(`//*[contains(@class, '${selectors.wrappers[wrapper]}')]//*[contains(., '${text}')]`);
-    if (!el) {
-        const content = await page.content();
+    const content = await page.evaluate(selector => {
+        const elements = document.querySelectorAll(selector);
+        if (!elements) return '';
+        const aTexts = [...elements].map(el => el.textContent);
+        return aTexts.join(' | ').replace(/[\t\s\n\r]+/g, ' ');
+    }, `.${selectors.wrappers[wrapper]}`);
+    if (!content.includes(text)) {
         throw new Error(
-            `Expected wrapper ${wrapper} to contain text: ${text}, but page contains only: ${content}`
+            `Expected wrapper ${wrapper} to contain text: ${text}, but it contains only: ${content}`
         );
     }
 };
 
 const shouldNotSeeText = async text => {
     const { page } = scope.context;
-    const content = await page.content();
+    const content = String(await page.$eval('*', el => el.innerText)).replace(/[\t\s\n\r]+/g, ' ');
     if (content.includes(text))
         throw new Error(
             `Expected page to not contain text: ${text}, but page contains: ${content}`
@@ -172,11 +176,15 @@ const shouldNotSeeText = async text => {
 
 const shouldNotSeeTextAt = async (text, wrapper) => {
     const { page } = scope.context;
-    const [el] = await page.$x(`//*[contains(@class, '${selectors.wrappers[wrapper]}')]//*[contains(., '${text}')]`);
-    if (el) {
-        const content = await page.content();
+    const content = await page.evaluate(selector => {
+        const elements = document.querySelectorAll(selector);
+        if (!elements) return '';
+        const aTexts = [...elements].map(el => el.innerText);
+        return aTexts.join(' | ').replace(/[\t\s\n\r]+/g, ' ');
+    }, `.${selectors.wrappers[wrapper]}:not(.sr-only)`);
+    if (content.includes(text)) {
         throw new Error(
-            `Expected wrapper ${wrapper} to not contain text: ${text}, but page contains: ${content}`
+            `Expected wrapper ${wrapper} to not contain text: ${text}, but it contains: ${content}`
         );
     }
 };

src/components/forms/FormFeedback.jsx

@@ -211,8 +211,9 @@ export const FormFeedback = (props) => {
                                 {(!formik.isValid || !formik.dirty)
                                     ? <div className="error text-center text-sm text-red-700 mt-1 mr-1">Please fill all necessary form fields</div>
                                     : <div className="text-gray-900 text-center text-sm mt-1 mr-1">
-                                        <div>This site is protected by reCAPTCHA and the Google </div>
+                                        <div>This site is protected by invisible reCAPTCHA and </div>
                                         <div>
+                                            <span> the Google </span>
                                             <a href="https://policies.google.com/privacy" className="mx-1 hover:underline" rel="noopener noreferrer nofollow" target="_blank">Privacy Policy</a>
                                             <span> and </span>
                                             <a href="https://policies.google.com/terms" className="mx-1 hover:underline" rel="noopener noreferrer nofollow" target="_blank">Terms of Service</a> apply.