fix: remove .col class that causes collision with Bootstrap (via #5541)
* improvement: address Bootstrap conflict by removing our .col class (#4574) * use `.parameters-col_description` selector in Cypress tests
This commit is contained in:
@@ -83,13 +83,13 @@ export default class LiveResponse extends React.Component {
|
|||||||
<table className="responses-table live-responses-table">
|
<table className="responses-table live-responses-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr className="responses-header">
|
<tr className="responses-header">
|
||||||
<td className="col col_header response-col_status">Code</td>
|
<td className="col_header response-col_status">Code</td>
|
||||||
<td className="col col_header response-col_description">Details</td>
|
<td className="col_header response-col_description">Details</td>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr className="response">
|
<tr className="response">
|
||||||
<td className="col response-col_status">
|
<td className="response-col_status">
|
||||||
{ status }
|
{ status }
|
||||||
{
|
{
|
||||||
notDocumented ? <div className="response-undocumented">
|
notDocumented ? <div className="response-undocumented">
|
||||||
@@ -98,7 +98,7 @@ export default class LiveResponse extends React.Component {
|
|||||||
: null
|
: null
|
||||||
}
|
}
|
||||||
</td>
|
</td>
|
||||||
<td className="col response-col_description">
|
<td className="response-col_description">
|
||||||
{
|
{
|
||||||
isError ? <span>
|
isError ? <span>
|
||||||
{`${response.get("name")}: ${response.get("message")}`}
|
{`${response.get("name")}: ${response.get("message")}`}
|
||||||
|
|||||||
@@ -13,8 +13,8 @@ export const OperationExt = ({ extensions, getComponent }) => {
|
|||||||
<table>
|
<table>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<td className="col col_header">Field</td>
|
<td className="col_header">Field</td>
|
||||||
<td className="col col_header">Value</td>
|
<td className="col_header">Value</td>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
|
|||||||
@@ -65,7 +65,7 @@ export default class ParameterRow extends Component {
|
|||||||
onChangeWrapper = (value, isXml = false) => {
|
onChangeWrapper = (value, isXml = false) => {
|
||||||
let { onChange, rawParam } = this.props
|
let { onChange, rawParam } = this.props
|
||||||
let valueForUpstream
|
let valueForUpstream
|
||||||
|
|
||||||
// Coerce empty strings and empty Immutable objects to null
|
// Coerce empty strings and empty Immutable objects to null
|
||||||
if(value === "" || (value && value.size === 0)) {
|
if(value === "" || (value && value.size === 0)) {
|
||||||
valueForUpstream = null
|
valueForUpstream = null
|
||||||
@@ -126,7 +126,7 @@ export default class ParameterRow extends Component {
|
|||||||
|
|
||||||
getParamKey() {
|
getParamKey() {
|
||||||
const { param } = this.props
|
const { param } = this.props
|
||||||
|
|
||||||
if(!param) return null
|
if(!param) return null
|
||||||
|
|
||||||
return `${param.get("name")}-${param.get("in")}`
|
return `${param.get("name")}-${param.get("in")}`
|
||||||
@@ -214,7 +214,7 @@ export default class ParameterRow extends Component {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<tr data-param-name={param.get("name")} data-param-in={param.get("in")}>
|
<tr data-param-name={param.get("name")} data-param-in={param.get("in")}>
|
||||||
<td className="col parameters-col_name">
|
<td className="parameters-col_name">
|
||||||
<div className={required ? "parameter__name required" : "parameter__name"}>
|
<div className={required ? "parameter__name required" : "parameter__name"}>
|
||||||
{ param.get("name") }
|
{ param.get("name") }
|
||||||
{ !required ? null : <span style={{color: "red"}}> *</span> }
|
{ !required ? null : <span style={{color: "red"}}> *</span> }
|
||||||
@@ -232,7 +232,7 @@ export default class ParameterRow extends Component {
|
|||||||
{ !showExtensions || !extensions.size ? null : extensions.map((v, key) => <ParameterExt key={`${key}-${v}`} xKey={key} xVal={v} /> )}
|
{ !showExtensions || !extensions.size ? null : extensions.map((v, key) => <ParameterExt key={`${key}-${v}`} xKey={key} xVal={v} /> )}
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td className="col parameters-col_description">
|
<td className="parameters-col_description">
|
||||||
{ param.get("description") ? <Markdown source={ param.get("description") }/> : null }
|
{ param.get("description") ? <Markdown source={ param.get("description") }/> : null }
|
||||||
|
|
||||||
{ (bodyParam || !isExecute) && isDisplayParamEnum ?
|
{ (bodyParam || !isExecute) && isDisplayParamEnum ?
|
||||||
@@ -291,12 +291,12 @@ export default class ParameterRow extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
{
|
{
|
||||||
!bodyParam && isExecute ?
|
!bodyParam && isExecute ?
|
||||||
<ParameterIncludeEmpty
|
<ParameterIncludeEmpty
|
||||||
onChange={this.onChangeIncludeEmpty}
|
onChange={this.onChangeIncludeEmpty}
|
||||||
isIncluded={specSelectors.parameterInclusionSettingFor(pathMethod, param.get("name"), param.get("in"))}
|
isIncluded={specSelectors.parameterInclusionSettingFor(pathMethod, param.get("name"), param.get("in"))}
|
||||||
isDisabled={value && value.size !== 0}
|
isDisabled={value && value.size !== 0}
|
||||||
param={param} />
|
param={param} />
|
||||||
: null
|
: null
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -139,8 +139,8 @@ export default class Parameters extends Component {
|
|||||||
<table className="parameters">
|
<table className="parameters">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th className="col col_header parameters-col_name">Name</th>
|
<th className="col_header parameters-col_name">Name</th>
|
||||||
<th className="col col_header parameters-col_description">Description</th>
|
<th className="col_header parameters-col_description">Description</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
|
|||||||
@@ -140,8 +140,8 @@ export default class Response extends React.Component {
|
|||||||
sampleResponse = response.getIn(["examples", activeContentType])
|
sampleResponse = response.getIn(["examples", activeContentType])
|
||||||
} else {
|
} else {
|
||||||
sampleResponse = schema ? getSampleSchema(
|
sampleResponse = schema ? getSampleSchema(
|
||||||
schema.toJS(),
|
schema.toJS(),
|
||||||
activeContentType,
|
activeContentType,
|
||||||
{
|
{
|
||||||
includeReadOnly: true,
|
includeReadOnly: true,
|
||||||
includeWriteOnly: true // writeOnly has no filtering effect in swagger 2.0
|
includeWriteOnly: true // writeOnly has no filtering effect in swagger 2.0
|
||||||
@@ -154,10 +154,10 @@ export default class Response extends React.Component {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<tr className={ "response " + ( className || "") } data-code={code}>
|
<tr className={ "response " + ( className || "") } data-code={code}>
|
||||||
<td className="col response-col_status">
|
<td className="response-col_status">
|
||||||
{ code }
|
{ code }
|
||||||
</td>
|
</td>
|
||||||
<td className="col response-col_description">
|
<td className="response-col_description">
|
||||||
|
|
||||||
<div className="response-col_description__inner">
|
<div className="response-col_description__inner">
|
||||||
<Markdown source={ response.get( "description" ) } />
|
<Markdown source={ response.get( "description" ) } />
|
||||||
@@ -237,7 +237,7 @@ export default class Response extends React.Component {
|
|||||||
) : null}
|
) : null}
|
||||||
|
|
||||||
</td>
|
</td>
|
||||||
{isOAS3 ? <td className="col response-col_links">
|
{isOAS3 ? <td className="response-col_links">
|
||||||
{ links ?
|
{ links ?
|
||||||
links.toSeq().map((link, key) => {
|
links.toSeq().map((link, key) => {
|
||||||
return <OperationLink key={key} name={key} link={ link } getComponent={getComponent}/>
|
return <OperationLink key={key} name={key} link={ link } getComponent={getComponent}/>
|
||||||
|
|||||||
@@ -117,8 +117,8 @@ export default class Responses extends React.Component {
|
|||||||
<table className="responses-table">
|
<table className="responses-table">
|
||||||
<thead>
|
<thead>
|
||||||
<tr className="responses-header">
|
<tr className="responses-header">
|
||||||
<td className="col col_header response-col_status">Code</td>
|
<td className="col_header response-col_status">Code</td>
|
||||||
<td className="col col_header response-col_description">Description</td>
|
<td className="col_header response-col_description">Description</td>
|
||||||
{ specSelectors.isOAS3() ? <td className="col col_header response-col_links">Links</td> : null }
|
{ specSelectors.isOAS3() ? <td className="col col_header response-col_links">Links</td> : null }
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
|
|||||||
@@ -139,7 +139,7 @@ const RequestBody = ({
|
|||||||
const isFile = type === "string" && (format === "binary" || format === "base64")
|
const isFile = type === "string" && (format === "binary" || format === "base64")
|
||||||
|
|
||||||
return <tr key={key} className="parameters" data-property-name={key}>
|
return <tr key={key} className="parameters" data-property-name={key}>
|
||||||
<td className="col parameters-col_name">
|
<td className="parameters-col_name">
|
||||||
<div className={required ? "parameter__name required" : "parameter__name"}>
|
<div className={required ? "parameter__name required" : "parameter__name"}>
|
||||||
{ key }
|
{ key }
|
||||||
{ !required ? null : <span style={{color: "red"}}> *</span> }
|
{ !required ? null : <span style={{color: "red"}}> *</span> }
|
||||||
@@ -153,7 +153,7 @@ const RequestBody = ({
|
|||||||
{ prop.get("deprecated") ? "deprecated": null }
|
{ prop.get("deprecated") ? "deprecated": null }
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td className="col parameters-col_description">
|
<td className="parameters-col_description">
|
||||||
<Markdown source={ description }></Markdown>
|
<Markdown source={ description }></Markdown>
|
||||||
{isExecute ? <div><JsonSchemaForm
|
{isExecute ? <div><JsonSchemaForm
|
||||||
fn={fn}
|
fn={fn}
|
||||||
|
|||||||
@@ -8,12 +8,12 @@ describe("#5452: <Select /> crashing in Parameters", function() {
|
|||||||
cy.visit("http://localhost:3230/?url=/documents/bugs/5452/openapi.yaml")
|
cy.visit("http://localhost:3230/?url=/documents/bugs/5452/openapi.yaml")
|
||||||
.get("#operations-default-get_endpoint")
|
.get("#operations-default-get_endpoint")
|
||||||
.click()
|
.click()
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.select("")
|
.select("")
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.should("exist")
|
.should("exist")
|
||||||
.select("fruit")
|
.select("fruit")
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.should("exist")
|
.should("exist")
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
@@ -22,12 +22,12 @@ describe("#5452: <Select /> crashing in Parameters", function() {
|
|||||||
cy.visit("http://localhost:3230/?url=/documents/bugs/5452/swagger.yaml")
|
cy.visit("http://localhost:3230/?url=/documents/bugs/5452/swagger.yaml")
|
||||||
.get("#operations-default-get_endpoint")
|
.get("#operations-default-get_endpoint")
|
||||||
.click()
|
.click()
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.select("")
|
.select("")
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.should("exist")
|
.should("exist")
|
||||||
.select("fruit")
|
.select("fruit")
|
||||||
.get(".parameters > tbody > tr > .col > select")
|
.get(".parameters > tbody > tr > .parameters-col_description > select")
|
||||||
.should("exist")
|
.should("exist")
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|||||||
Reference in New Issue
Block a user