Fix cypress files to cypress version 10 (#1124)

* Major npm packages update

* npm i command added to dockerfile

* globally install npm new version

* remove the packages lock file copy

* package-lock commit and dockerfile revert changes

* space removal

Co-authored-by: Roee Gadot <roee.gadot@up9.com>

acceptanceTests/Makefile

@@ -1,2 +1,3 @@
 test: ## Run acceptance tests.
+	@npm install cypress@10.0.1 -y
 	@go test ./... -timeout 1h -v

acceptanceTests/cypress.config.js

@@ -0,0 +1,31 @@
+const { defineConfig } = require('cypress')
+
+module.exports = defineConfig({
+  watchForFileChanges: false,
+  viewportWidth: 1920,
+  viewportHeight: 1080,
+  video: false,
+  screenshotOnRunFailure: false,
+  defaultCommandTimeout: 6000,
+  env: {
+    testUrl: 'http://localhost:8899/',
+    redactHeaderContent: 'User-Header[REDACTED]',
+    redactBodyContent: '{ "User": "[REDACTED]" }',
+    regexMaskingBodyContent: '[REDACTED]',
+    greenFilterColor: 'rgb(210, 250, 210)',
+    redFilterColor: 'rgb(250, 214, 220)',
+    bodyJsonClass: '.hljs',
+    mizuWidth: 1920,
+    normalMizuHeight: 1080,
+    hugeMizuHeight: 3500,
+  },
+  e2e: {
+    // We've imported your old cypress plugins here.
+    // You may want to clean this up later by importing these.
+    // setupNodeEvents(on, config) {
+    //   return require('./cypress/plugins/index.js')(on, config)
+    // },
+    specPattern: 'cypress/e2e/tests/*.js',
+    supportFile: false
+  },
+})

acceptanceTests/cypress.json

@@ -1,34 +0,0 @@
-{
-  "watchForFileChanges":false,
-  "viewportWidth": 1920,
-  "viewportHeight": 1080,
-  "video": false,
-  "screenshotOnRunFailure": false,
-  "defaultCommandTimeout": 6000,
-  "testFiles": [
-    "tests/GuiPort.js",
-    "tests/MultipleNamespaces.js",
-    "tests/Redact.js",
-    "tests/NoRedact.js",
-    "tests/Regex.js",
-    "tests/RegexMasking.js",
-    "tests/IgnoredUserAgents.js",
-    "tests/UiTest.js",
-    "tests/Redis.js",
-    "tests/Rabbit.js",
-    "tests/serviceMapFunction.js"
-  ],
-
-  "env": {
-    "testUrl": "http://localhost:8899/",
-    "redactHeaderContent": "User-Header[REDACTED]",
-    "redactBodyContent": "{ \"User\": \"[REDACTED]\" }",
-    "regexMaskingBodyContent": "[REDACTED]",
-    "greenFilterColor": "rgb(210, 250, 210)",
-    "redFilterColor": "rgb(250, 214, 220)",
-    "bodyJsonClass": ".hljs",
-    "mizuWidth": 1920,
-    "normalMizuHeight": 1080,
-    "hugeMizuHeight": 3500
-  }
-}

acceptanceTests/cypress/e2e/testHelpers/TrafficHelper.js

@@ -4,8 +4,6 @@ export const valueTabs = {
     none: null
 }
 
-const maxEntriesInDom = 13;
-
 export function isValueExistsInElement(shouldInclude, content, domPathToContainer){
     it(`should ${shouldInclude ? '' : 'not'} include '${content}'`, function () {
         cy.get(domPathToContainer).then(htmlText => {

acceptanceTests/extensions_test.go

@@ -105,7 +105,7 @@ func TestRedis(t *testing.T) {
 		}
 	}
 
-	RunCypressTests(t, "npx cypress run --spec  \"cypress/integration/tests/Redis.js\"")
+	RunCypressTests(t, "npx cypress run --spec  \"cypress/e2e/tests/Redis.js\"")
 }
 
 func TestAmqp(t *testing.T) {
@@ -236,5 +236,5 @@ func TestAmqp(t *testing.T) {
 		ch.Close()
 	}
 
-	RunCypressTests(t, "npx cypress run --spec  \"cypress/integration/tests/Rabbit.js\"")
+	RunCypressTests(t, "npx cypress run --spec  \"cypress/e2e/tests/Rabbit.js\"")
 }

acceptanceTests/tap_test.go

@@ -78,7 +78,7 @@ func basicTapTest(t *testing.T, shouldCheckSrcAndDest bool, extraArgs... string)
 				expectedPodsStr += fmt.Sprintf("Name:%vNamespace:%v", expectedPods[i].Name, expectedPods[i].Namespace)
 			}
 
-			RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/integration/tests/UiTest.js\" --env entriesCount=%d,arrayDict=%v,shouldCheckSrcAndDest=%v",
+			RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/e2e/tests/UiTest.js\" --env entriesCount=%d,arrayDict=%v,shouldCheckSrcAndDest=%v",
 				entriesCount, expectedPodsStr, shouldCheckSrcAndDest))
 		})
 	}
@@ -135,7 +135,7 @@ func TestTapGuiPort(t *testing.T) {
 				}
 			}
 
-			RunCypressTests(t, fmt.Sprintf("npx cypress run --spec \"cypress/integration/tests/GuiPort.js\" --env name=%v,namespace=%v,port=%d",
+			RunCypressTests(t, fmt.Sprintf("npx cypress run --spec \"cypress/e2e/tests/GuiPort.js\" --env name=%v,namespace=%v,port=%d",
 				"httpbin", "mizu-tests", guiPort))
 		})
 	}
@@ -182,7 +182,7 @@ func TestTapAllNamespaces(t *testing.T) {
 		return
 	}
 
-	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/integration/tests/MultipleNamespaces.js\" --env name1=%v,name2=%v,name3=%v,namespace1=%v,namespace2=%v,namespace3=%v",
+	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/e2e/tests/MultipleNamespaces.js\" --env name1=%v,name2=%v,name3=%v,namespace1=%v,namespace2=%v,namespace3=%v",
 		expectedPods[0].Name, expectedPods[1].Name, expectedPods[2].Name, expectedPods[0].Namespace, expectedPods[1].Namespace, expectedPods[2].Namespace))
 }
 
@@ -231,7 +231,7 @@ func TestTapMultipleNamespaces(t *testing.T) {
 		return
 	}
 
-	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/integration/tests/MultipleNamespaces.js\" --env name1=%v,name2=%v,name3=%v,namespace1=%v,namespace2=%v,namespace3=%v",
+	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/e2e/tests/MultipleNamespaces.js\" --env name1=%v,name2=%v,name3=%v,namespace1=%v,namespace2=%v,namespace3=%v",
 		expectedPods[0].Name, expectedPods[1].Name, expectedPods[2].Name, expectedPods[0].Namespace, expectedPods[1].Namespace, expectedPods[2].Namespace))
 }
 
@@ -277,7 +277,7 @@ func TestTapRegex(t *testing.T) {
 		return
 	}
 
-	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/integration/tests/Regex.js\" --env name=%v,namespace=%v",
+	RunCypressTests(t, fmt.Sprintf("npx cypress run --spec  \"cypress/e2e/tests/Regex.js\" --env name=%v,namespace=%v",
 		expectedPods[0].Name, expectedPods[0].Namespace))
 }
 
@@ -376,7 +376,7 @@ func TestTapRedact(t *testing.T) {
 		}
 	}
 
-	RunCypressTests(t, "npx cypress run --spec  \"cypress/integration/tests/Redact.js\"")
+	RunCypressTests(t, "npx cypress run --spec  \"cypress/e2e/tests/Redact.js\"")
 }
 
 func TestTapNoRedact(t *testing.T) {
@@ -426,7 +426,7 @@ func TestTapNoRedact(t *testing.T) {
 		}
 	}
 
-	RunCypressTests(t, "npx cypress run --spec  \"cypress/integration/tests/NoRedact.js\"")
+	RunCypressTests(t, "npx cypress run --spec  \"cypress/e2e/tests/NoRedact.js\"")
 }
 
 func TestTapRegexMasking(t *testing.T) {
@@ -479,7 +479,7 @@ func TestTapRegexMasking(t *testing.T) {
 		}
 	}
 
-	RunCypressTests(t, "npx cypress run --spec \"cypress/integration/tests/RegexMasking.js\"")
+	RunCypressTests(t, "npx cypress run --spec \"cypress/e2e/tests/RegexMasking.js\"")
 
 }
 
@@ -541,7 +541,7 @@ func TestTapIgnoredUserAgents(t *testing.T) {
 		}
 	}
 
-	RunCypressTests(t, "npx cypress run --spec  \"cypress/integration/tests/IgnoredUserAgents.js\"")
+	RunCypressTests(t, "npx cypress run --spec  \"cypress/e2e/tests/IgnoredUserAgents.js\"")
 }
 
 func TestTapDumpLogs(t *testing.T) {

ui-common/package.json

@@ -28,18 +28,18 @@
     "@material-ui/icons": "^4.11.3",
     "@material-ui/lab": "^4.0.0-alpha.60",
     "@types/jest": "^26.0.24",
-    "@types/node": "^12.20.52",
+    "@types/node": "^12.20.54",
     "node-sass": "^6.0.1",
     "react": "^17.0.2",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dom": "^17.0.2",
-    "recoil": "^0.5.2"
+    "recoil": "^0.7.2"
   },
   "dependencies": {
     "@craco/craco": "^6.4.3",
     "@types/lodash": "^4.14.182",
     "@uiw/react-textarea-code-editor": "^1.6.0",
-    "axios": "^0.25.0",
+    "axios": "^0.27.2",
     "core-js": "^3.22.7",
     "highlight.js": "^11.5.1",
     "json-beautify": "^1.1.1",
@@ -57,9 +57,9 @@
     "react-scrollable-feed-virtualized": "^1.4.9",
     "react-syntax-highlighter": "^15.5.0",
     "react-toastify": "^8.2.0",
-    "redoc": "^2.0.0-rc.59",
+    "redoc": "^2.0.0-rc.71",
     "styled-components": "^5.3.5",
-    "web-vitals": "^1.1.2",
+    "web-vitals": "^2.1.4",
     "xml-formatter": "^2.6.1"
   },
   "devDependencies": {
@@ -67,7 +67,7 @@
     "@svgr/rollup": "^6.2.1",
     "cross-env": "^7.0.3",
     "env-cmd": "^10.1.0",
-    "gh-pages": "^2.2.0",
+    "gh-pages": "^4.0.0",
     "microbundle-crl": "^0.13.11",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.6.2",

ui/package.json

@@ -8,10 +8,10 @@
     "@material-ui/icons": "^4.11.3",
     "@material-ui/lab": "^4.0.0-alpha.60",
     "@types/jest": "^26.0.24",
-    "@types/node": "^12.20.52",
+    "@types/node": "^12.20.54",
     "@uiw/react-textarea-code-editor": "^1.6.0",
     "@up9/mizu-common": "file:up9-mizu-common-0.0.0.tgz",
-    "axios": "^0.25.0",
+    "axios": "^0.27.2",
     "core-js": "^3.22.7",
     "craco-babel-loader": "^1.0.3",
     "highlight.js": "^11.5.1",
@@ -33,10 +33,10 @@
     "react-scrollable-feed-virtualized": "^1.4.9",
     "react-syntax-highlighter": "^15.5.0",
     "react-toastify": "^8.2.0",
-    "redoc": "^2.0.0-rc.59",
+    "redoc": "^2.0.0-rc.71",
     "styled-components": "^5.3.5",
     "typescript": "^4.7.2",
-    "web-vitals": "^1.1.2",
+    "web-vitals": "^2.1.4",
     "xml-formatter": "^2.6.1"
   },
   "devDependencies": {
@@ -45,7 +45,7 @@
     "react-app-rewire-alias": "^1.1.7",
     "react-dev-utils": "^12.0.1",
     "react-error-overlay": "6.0.9",
-    "recoil": "^0.5.2"
+    "recoil": "^0.7.2"
   },
   "scripts": {
     "prestart": "../devops/ui-common-pack.sh $PWD",

ui/src/index.sass

@@ -152,7 +152,7 @@ button
   display: none
 
   // remove powerdby
-.sc-ilfuhL
+.sc-kYWVYA
   display: none !important
 
 // enable view elements inside redoc