Required Path Parameters are missing the .star class given to required Schema properties

[greyliances]

Q&A

• OS: win11
• Browser: firefox
• Version: 124.0.2
• Method of installation: dist assets via https://cdn.jsdelivr.net/npm/swagger-ui-dist@5.15.1/swagger-ui-bundle.min.js
• Swagger-UI version: 5.15.1
• Swagger/OpenAPI version: 3.0.3

Content & configuration

Required Path Parameter

Required Schema Property

Example Swagger/OpenAPI definition:

{
  "components": {
    "parameters": {
      "PathID": {
        "in": "path",
        "name": "id",
        "required": true,
        "schema": {
          "type": "string"
        }
      }
    },
    "schemas": {
      "SomeObject": {
        "example": {
          "id": "502f6aacfcb8e5940e829306054dc20a"
        },
        "type": "object",
        "required": ["id"],
        "properties": {
          "id": {
            "type": "string"
          }
        }
      }
    }
  },
  "info": {
    "title": "Title",
    "version": "1.0"
  },
  "openapi": "3.0.3",
  "paths": {
    "/a/{id}": {
      "get": {
        "responses": {
          "200": {
            "description": "Response Description",
            "content": {
              "application/json": {}
            }
          }
        }
      },
      "parameters": [
        {
          "$ref": "#/components/parameters/PathID"
        }
      ]
    }
  }
}

Swagger-UI configuration options:

    SwaggerUIBundle({
      spec: data,
      dom_id: '#api_container',
      presets: [SwaggerUIBundle.presets.apis],
      layout: 'BaseLayout',
      showCommonExtensions: true
    });

Describe the bug you're encountering

Required Schema Properties have an appended red asterisk as a span element and include an additional .star class on said span element
Required Path Parameters have a red asterisk (and an ::after element with the content required) that indicates its importance but are missing the .star class that required Schema properties possess

To reproduce...

Steps to reproduce the behavior:

1. Use the provided OpenAPI definitions and load them as the spec value in the Swagger-UI configuration option (make sure to also provide a valid dom_id)
2. Click on the GET /a/{id} path and navigate to the PARAMETERS list
3. Inspect the red asterisk on the id field
4. Observe the missing .star class on the span element
5. Navigate to the Schemas List and open/click on the SomeObject schema definition
6. Inspect the red asterisk on the id field
7. Observe the .star class on the span element

Expected behavior

The red asterisk after required path parameters should also include the .star class for consistency

Screenshots

Required Path Parameter

Required Schema Property

Additional context or thoughts

As part of a customization of some of the design elements, i wanted to adjust the way required properties & fields look
During that process i noticed that i would need to style their red asterisk the following way

 div.table-container table.parameters tbody tr td.parameters-col_name div.parameter__name.required span:nth-child(1),
.star {
  display: none;
}

Instead of being able to just address them via .star

This is extremely minor and easy to work around, but i still think that it should be resolved for the sake of consistency - albeit with a pretty low priority

I think that this is caused by this specific line

swagger-ui/src/core/components/parameter-row.jsx

Line 276 in 8d94b55

{ !required ? null : <span>&nbsp;*</span> }

but i haven't familiarized myself with this codebase yet