fix(try-it-out): required boolean default value set to empty string (#6449)

ref: #6429

* fix(try-it-out): required boolean default value set to empty string
* test(try-it-out): required enum and boolean fields

src/core/json-schema-components.jsx

@@ -320,18 +320,16 @@ export class JsonSchema_boolean extends Component {
     let { getComponent, value, errors, schema, required, disabled } = this.props
     errors = errors.toJS ? errors.toJS() : []
     let enumValue = schema && schema.get ? schema.get("enum") : null
-    if (!enumValue) {
+    let allowEmptyValue = !enumValue || !required
-      // in case schema.get() also returns undefined/null
+    let booleanValue = !enumValue && fromJS(["true", "false"])
-      enumValue = fromJS(["true", "false"])
-    }
     const Select = getComponent("Select")
 
     return (<Select className={ errors.length ? "invalid" : ""}
                     title={ errors.length ? errors : ""}
                     value={ String(value) }
                     disabled={ disabled }
-                    allowedValues={ enumValue }
+                    allowedValues={ enumValue || booleanValue }
-                    allowEmptyValue={ !required }
+                    allowEmptyValue={ allowEmptyValue }
                     onChange={ this.onEnumChange }/>)
   }
 }

test/e2e-cypress/static/documents/features/schema-form-enum-boolean.yaml

@@ -0,0 +1,87 @@
+swagger: "2.0"
+info:
+  description: "Test Required Enum and Boolean with Execute" 
+  version: "1.0.0"
+  title: "Swagger Petstore"
+  termsOfService: "http://swagger.io/terms/"
+  contact:
+    email: "apiteam@swagger.io"
+  license:
+    name: "Apache 2.0"
+    url: "http://www.apache.org/licenses/LICENSE-2.0.html"
+host: "petstore.swagger.io"
+basePath: "/v2"
+tags:
+- name: "pet"
+  description: "Everything about your Pets"
+  externalDocs:
+    description: "Find out more"
+    url: "http://swagger.io"
+schemes:
+- "https"
+- "http"
+paths:
+  /pet/findByStatus:
+    get:
+      tags:
+      - "pet"
+      summary: "Finds Pets by status"
+      description: "Multiple status values can be provided with comma separated strings"
+      operationId: "findPetsByStatus"
+      produces:
+      - "application/xml"
+      - "application/json"
+      parameters:
+      - name: "status"
+        in: "query"
+        description: "Status values that need to be considered for filter"
+        required: true
+        type: "array"
+        items:
+          type: "string"
+          enum:
+          - "available"
+          - "pending"
+          - "sold"
+          default: "available"
+        collectionFormat: "multi"
+      - name: "expectIsOptional"
+        in: "query"
+        description: "this field should be optional"
+        required: false
+        type: boolean
+      - name: "expectIsRequired"
+        in: "query"
+        description: "this field should be required"
+        required: true
+        type: boolean
+      responses:
+        "200":
+          description: "successful operation"
+          schema:
+            type: "array"
+            items:
+              $ref: "#/definitions/Pet"
+        "400":
+          description: "Invalid status value"
+definitions:
+  Pet:
+    type: "object"
+    required:
+    - "name"
+    properties:
+      id:
+        type: "integer"
+        format: "int64"
+      name:
+        type: "string"
+        example: "doggie"
+      status:
+        type: "string"
+        description: "pet status in the store"
+        enum:
+        - "available"
+        - "pending"
+        - "sold"
+    xml:
+      name: "Pet"

test/e2e-cypress/tests/features/schema-form-enum-boolean.js

@@ -0,0 +1,129 @@
+/**
+ * @prettier
+ */
+
+describe("JSON Schema Form: Enum & Boolean in a Parameter", () => {
+  beforeEach(() => {
+    cy.visit(
+      "/?url=/documents/features/schema-form-enum-boolean.yaml"
+    )
+      .get("#operations-pet-findPetsByStatus")
+      .click()
+      // Expand Try It Out
+      .get(".try-out__btn")
+      .click()
+    // @alias Execute Button
+    cy.get(".execute.opblock-control__btn").as("executeBtn")
+    // @alias Parameters
+    cy.get(".opblock-section tbody > tr > .parameters-col_description > select")
+      .eq(0)
+      .as("enumIsRequired")
+    cy.get(".opblock-section tbody > tr > .parameters-col_description > select")
+      .eq(1)
+      .as("booleanIsOptional")
+    cy.get(".opblock-section tbody > tr > .parameters-col_description > select")
+      .eq(2)
+      .as("booleanIsRequired")
+  })
+
+  it("should render @enumIsRequired with list of three options", () => {
+    cy.get("@enumIsRequired")
+      .should("contains.text", "available")
+      .should("contains.text", "pending")
+      .should("contains.text", "sold")
+      .should("not.contains.text", "--")
+      .find("option")
+      .should("have.length", 3)
+  })
+  it("should render @booleanIsOptional with default empty string value (display '--')", () => {
+    cy.get("@booleanIsOptional")
+      .should("have.value", "")
+      .should("contains.text", "--")
+  })
+  it("should render @booleanIsRequired with default empty string value (display '--')", () => {
+    cy.get("@booleanIsRequired")
+      .should("have.value", "")
+      .should("contains.text", "--")
+  })
+  it("should NOT be able to execute with empty @enumIsRequired and @booleanIsRequired values", () => {
+    // Execute
+    cy.get("@executeBtn")
+      .click()
+    cy.get("@enumIsRequired")
+      .should("have.class", "invalid")
+    cy.get("@booleanIsRequired")
+      .should("have.class", "invalid")
+    // cURL component
+    cy.get(".responses-wrapper .curl-command")
+      .should("not.exist")
+  })
+  it("should NOT be able to execute with empty @booleanIsRequired value, but valid @enumIsRequired", () => {
+    cy.get("@enumIsRequired")
+      .select("pending")
+    // Execute
+    cy.get("@executeBtn")
+      .click()
+    cy.get("@enumIsRequired")
+      .should("not.have.class", "invalid")
+    cy.get("@booleanIsRequired")
+      .should("have.class", "invalid")
+    // cURL component
+    cy.get(".responses-wrapper .curl-command")
+      .should("not.exist")
+  })
+  it("should NOT be able to execute with empty @enumIsRequired value, but valid @booleanIsRequired", () => {
+    cy.get("@booleanIsRequired")
+      .select("false")
+    // Execute
+    cy.get("@executeBtn")
+      .click()
+    cy.get("@enumIsRequired")
+      .should("have.class", "invalid")
+    cy.get("@booleanIsRequired")
+      .should("not.have.class", "invalid")
+    // cURL component
+    cy.get(".responses-wrapper .curl-command")
+      .should("not.exist")
+  })
+  it("should execute, if @booleanIsOptional value is 'false'", () => {
+    cy.get("@enumIsRequired")
+      .select("pending")
+    cy.get("@booleanIsRequired")
+      .select("false")
+    cy.get("@booleanIsOptional")
+      .select("false")
+    // Execute
+    cy.get("@executeBtn")
+      .click()
+    cy.get("@enumIsRequired")
+      .should("not.have.class", "invalid")
+    cy.get("@booleanIsRequired")
+      .should("not.have.class", "invalid")
+      .should("not.contains.text", "expectIsOptional")
+    // cURL component
+    cy.get(".responses-wrapper .curl-command")
+      .should("exist")
+      .get(".responses-wrapper .curl-command span")
+      .should("contains.text", "expectIsOptional=false")
+  })
+  it("should execute, but NOT send @booleanIsOptional value if not provided", () => {
+    cy.get("@enumIsRequired")
+      .select("pending")
+    cy.get("@booleanIsRequired")
+      .select("false")
+    // Execute
+    cy.get("@executeBtn")
+      .click()
+    cy.get("@enumIsRequired")
+      .should("not.have.class", "invalid")
+    cy.get("@booleanIsRequired")
+      .should("not.have.class", "invalid")
+      .should("not.contains.text", "expectIsOptional")
+    // cURL component
+    cy.get(".responses-wrapper .curl-command")
+      .should("exist")
+      .get(".responses-wrapper .curl-command span")
+      .should("not.contains.text", "expectIsOptional")
+  })
+
+})