fix(serverVariables): refresh state on definition change (#7821)

* fix(serverVariables): refresh state on definition change

* test(serverVariables): urls with server variables assertions

test/e2e-cypress/static/configs/urls-server-variables.yaml

@@ -0,0 +1,5 @@
+urls:
+- name: One
+  url: /documents/features/urls/server-variables-1.yaml
+- name: Two
+  url: /documents/features/urls/server-variables-2.yaml

test/e2e-cypress/static/documents/features/urls/server-variables-1.yaml

@@ -0,0 +1,38 @@
+openapi: 3.0.1
+info:
+  title: Server Variables - One
+  description: sample OAS 3 definition to test server variables with urls
+  version: 1.0.0
+servers:
+- url: "https://localhost:3200{basePath}"
+  variables:
+    basePath:
+      default: "/oneFirstUrl"
+- url: "http://localhost:3201{basePath}"
+  variables:
+    basePath:
+      default: "/oneSecondUrl"
+paths:
+  /a:
+    post:
+      summary: simple service A
+      requestBody:
+        content:
+          'application/json':
+            schema:
+              properties:
+                foo:
+                  type: string
+                bar:
+                  type: string
+              required:
+                - foo
+              type: object
+        required: true
+      responses:
+        200:
+          description: OK
+          content:
+            application/json:
+              schema:
+                type: 'string'

test/e2e-cypress/static/documents/features/urls/server-variables-2.yaml

@@ -0,0 +1,38 @@
+openapi: 3.0.1
+info:
+  title: Server Variables - Two
+  description: sample OAS 3 definition to test server variables with urls
+  version: 1.0.0
+servers:
+- url: "https://localhost:3200{basePath}"
+  variables:
+    basePath:
+      default: "/twoFirstUrl"
+- url: "http://localhost:3201{basePath}"
+  variables:
+    basePath:
+      default: "/twoSecondUrl"
+paths:
+  /b:
+    post:
+      summary: simple service B
+      requestBody:
+        content:
+          'application/json':
+            schema:
+              properties:
+                foo:
+                  type: string
+                bar:
+                  type: string
+              required:
+                - foo
+              type: object
+        required: true
+      responses:
+        200:
+          description: OK
+          content:
+            application/json:
+              schema:
+                type: 'string'

test/e2e-cypress/tests/features/urls.js

@@ -36,3 +36,76 @@ describe("configuration options: `urls` and `urls.primaryName`", () => {
       .should("equal", "/documents/features/urls/2.yaml")
   })
 })
+
+describe("urls with server variables", () => {
+  it("should compute a url and default server variables", () => {
+    cy.visit("/?configUrl=/configs/urls-server-variables.yaml")
+      .get("code")
+      .should("have.text", "https://localhost:3200/oneFirstUrl")
+      .get("tr > :nth-child(1)")
+      .should("have.text", "basePath")
+      .get("input")
+      .should("have.value", "/oneFirstUrl")
+  })
+  it("should change server variables", () => {
+    cy.visit("/?configUrl=/configs/urls-server-variables.yaml")
+      .get("code")
+      .should("have.text", "https://localhost:3200/oneFirstUrl")
+      .get("tr > :nth-child(1)")
+      .should("have.text", "basePath")
+      .get("input")
+      .should("have.value", "/oneFirstUrl")
+      .get(".servers > label > select")
+      .eq(0)
+      .select(1)
+      .get("input")
+      .should("have.value", "/oneSecondUrl")
+  })
+  it("should select and compute second url", () => {
+    cy.visit("/?configUrl=/configs/urls-server-variables.yaml")
+      .get("select > option")
+      .eq(1)
+      .should("have.text", "Two")
+      .get("select")
+      .eq(0)
+      .select(1)
+      .get("code")
+      .should("have.text", "https://localhost:3200/twoFirstUrl")
+      .get("input")
+      .should("have.value", "/twoFirstUrl")
+  })
+  it("should select second url, then toggle back to first url", () => {
+    cy.visit("/?configUrl=/configs/urls-server-variables.yaml")
+      .get("select > option")
+      .get("select")
+      .eq(0)
+      .select(1)
+      .get("input")
+      .should("have.value", "/twoFirstUrl")
+      // toggle url back
+      .get("select")
+      .eq(0)
+      .select(0)
+      .get("code")
+      .should("have.text", "https://localhost:3200/oneFirstUrl")
+      .get("input")
+      .should("have.value", "/oneFirstUrl")
+  })
+  it("should change server variables, then select second url, and maintain server variables index", () => {
+    cy.visit("/?configUrl=/configs/urls-server-variables.yaml")
+      .get(".servers > label >select")
+      .eq(0)
+      .select(1)
+      .get("input")
+      .should("have.value", "/oneSecondUrl")
+      // change url
+      .get("select > option")
+      .get("select")
+      .eq(0)
+      .select(1)
+      .get("input")
+      .should("have.value", "/twoSecondUrl")
+      .get("input")
+      .should("have.value", "/twoSecondUrl")
+  })
+})