SONAR-11619 Remove label[for] styling and fix some input ids

diff --git a/server/sonar-web/src/main/js/app/styles/init/forms.css b/server/sonar-web/src/main/js/app/styles/init/forms.css
index 3e709ab3d5305c0b470317980e49f3b2351efd0c..2db2d3eac0f9b8b6d6aba4ddd495b446f4c40230 100644 (file)
--- a/server/sonar-web/src/main/js/app/styles/init/forms.css
+++ b/server/sonar-web/src/main/js/app/styles/init/forms.css
@@ -189,10 +189,6 @@ em.mandatory {
   font-style: italic;
 }
 
-label[for] {
-  cursor: pointer;
-}
-
 .form-field {
   clear: both;
   display: block;

diff --git a/server/sonar-web/src/main/js/apps/create/components/OrganizationAvatarInput.tsx b/server/sonar-web/src/main/js/apps/create/components/OrganizationAvatarInput.tsx
index 62bcdec93cfe18d2dd4fcb6c2a65f3259895cf2b..30655bd237aca0928adb1db3f6f9eaae49cd7cbd 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/components/OrganizationAvatarInput.tsx
+++ b/server/sonar-web/src/main/js/apps/create/components/OrganizationAvatarInput.tsx
@@ -97,7 +97,7 @@ export default class OrganizationAvatarInput extends React.PureComponent<Props,
               'is-invalid': isInvalid,
               'is-valid': isValid
             })}
-            id="organization-display-name"
+            id="organization-avatar"
             onBlur={this.handleBlur}
             onChange={this.handleChange}
             onFocus={this.handleFocus}

diff --git a/server/sonar-web/src/main/js/apps/create/components/OrganizationDescriptionInput.tsx b/server/sonar-web/src/main/js/apps/create/components/OrganizationDescriptionInput.tsx
index 4b99911e973903a8708162575b934af82cd91c91..848510025b4384c75a06f6809ad3bfd273aeb483 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/components/OrganizationDescriptionInput.tsx
+++ b/server/sonar-web/src/main/js/apps/create/components/OrganizationDescriptionInput.tsx
@@ -72,7 +72,7 @@ export default class OrganizationDescriptionInput extends React.PureComponent<Pr
     return (
       <ValidationInput
         error={this.state.error}
-        id="organization-display-name"
+        id="organization-description"
         isInvalid={isInvalid}
         isValid={isValid}
         label={translate('onboarding.create_organization.description')}>

diff --git a/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationAvatarInput-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationAvatarInput-test.tsx.snap
index 0750e70fdd451d94d377d71c25ad3ab06d96ebb3..a2f801bc5d495058b221299910773a836065041c 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationAvatarInput-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationAvatarInput-test.tsx.snap
@@ -19,7 +19,7 @@ exports[`should display the fallback avatar when there is no url 1`] = `
   />
   <input
     className="input-super-large text-middle"
-    id="organization-display-name"
+    id="organization-avatar"
     onBlur={[Function]}
     onChange={[Function]}
     onFocus={[Function]}
@@ -49,7 +49,7 @@ exports[`should render correctly 1`] = `
   />
   <input
     className="input-super-large text-middle"
-    id="organization-display-name"
+    id="organization-avatar"
     onBlur={[Function]}
     onChange={[Function]}
     onFocus={[Function]}

diff --git a/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationDescriptionInput-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationDescriptionInput-test.tsx.snap
index 80e11c04f111bca74c56f06dbe865fc1dc589d0d..a8ec8559b622eb8ddd3a644fdee9e1a4121367cc 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationDescriptionInput-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/create/components/__tests__/__snapshots__/OrganizationDescriptionInput-test.tsx.snap
@@ -2,7 +2,7 @@
 
 exports[`should render correctly 1`] = `
 <ValidationInput
-  id="organization-display-name"
+  id="organization-description"
   isInvalid={false}
   isValid={false}
   label="onboarding.create_organization.description"

diff --git a/server/sonar-web/src/main/js/apps/create/project/OrganizationInput.tsx b/server/sonar-web/src/main/js/apps/create/project/OrganizationInput.tsx
index 1bbdbd9f6ab749e0d60842dc615e080f5539f20d..142514dd34ec140e1cc6d6acdb3ff694b4548d4e 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/project/OrganizationInput.tsx
+++ b/server/sonar-web/src/main/js/apps/create/project/OrganizationInput.tsx
@@ -47,8 +47,10 @@ export class OrganizationInput extends React.PureComponent<Props & WithRouterPro
     return (
       <div className="form-field spacer-bottom">
         <label htmlFor="select-organization">
-          {translate('onboarding.create_project.organization')}
-          <em className="mandatory">*</em>
+          <span className="text-middle">
+            <strong>{translate('onboarding.create_project.organization')}</strong>
+            <em className="mandatory">*</em>
+          </span>
         </label>
         <OrganizationSelect
           hideIcons={!autoImport}

diff --git a/server/sonar-web/src/main/js/apps/create/project/__tests__/__snapshots__/OrganizationInput-test.tsx.snap b/server/sonar-web/src/main/js/apps/create/project/__tests__/__snapshots__/OrganizationInput-test.tsx.snap
index 887b5cff207a85f4461a8b7aba4d8191ed849c03..ba9fc2ff4507832e8d3f91d2aa73331fead63994 100644 (file)
--- a/server/sonar-web/src/main/js/apps/create/project/__tests__/__snapshots__/OrganizationInput-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/create/project/__tests__/__snapshots__/OrganizationInput-test.tsx.snap
@@ -7,12 +7,18 @@ exports[`should render correctly 1`] = `
   <label
     htmlFor="select-organization"
   >
-    onboarding.create_project.organization
-    <em
-      className="mandatory"
+    <span
+      className="text-middle"
     >
-      *
-    </em>
+      <strong>
+        onboarding.create_project.organization
+      </strong>
+      <em
+        className="mandatory"
+      >
+        *
+      </em>
+    </span>
   </label>
   <OrganizationSelect
     hideIcons={true}

diff --git a/server/sonar-web/src/main/js/apps/custom-measures/components/Form.tsx b/server/sonar-web/src/main/js/apps/custom-measures/components/Form.tsx
index db8c085fdd294923944274cb7037225c0cc0a4e7..261872e75ae6e40a5a074413566e3d10d92fd51a 100644 (file)
--- a/server/sonar-web/src/main/js/apps/custom-measures/components/Form.tsx
+++ b/server/sonar-web/src/main/js/apps/custom-measures/components/Form.tsx
@@ -123,6 +123,7 @@ export default class Form extends React.PureComponent<Props, State> {
           <Select
             autoFocus={true}
             clearable={false}
+            id="create-custom-measure-metric"
             onChange={this.handleMetricSelect}
             options={options}
             value={this.state.metricKey}

diff --git a/server/sonar-web/src/main/js/apps/custom-measures/components/__tests__/__snapshots__/Form-test.tsx.snap b/server/sonar-web/src/main/js/apps/custom-measures/components/__tests__/__snapshots__/Form-test.tsx.snap
index c77f5433a0986dbbde5e32143784f91f611d8bfb..91da25f4c4b31c3e73fd28bad50e34a074a8af07 100644 (file)
--- a/server/sonar-web/src/main/js/apps/custom-measures/components/__tests__/__snapshots__/Form-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/custom-measures/components/__tests__/__snapshots__/Form-test.tsx.snap
@@ -135,6 +135,7 @@ exports[`should render form 2`] = `
         <Select
           autoFocus={true}
           clearable={false}
+          id="create-custom-measure-metric"
           onChange={[Function]}
           options={
             Array [

diff --git a/server/sonar-web/src/main/js/apps/custom-metrics/components/Form.tsx b/server/sonar-web/src/main/js/apps/custom-metrics/components/Form.tsx
index c945e625181c3bcb997934148c4f19645bf717c4..ad67fa6bc80aaa2ad47558e9a8caeb104c31a3dc 100644 (file)
--- a/server/sonar-web/src/main/js/apps/custom-metrics/components/Form.tsx
+++ b/server/sonar-web/src/main/js/apps/custom-metrics/components/Form.tsx
@@ -149,6 +149,7 @@ export default class Form extends React.PureComponent<Props, State> {
               <div className="modal-field">
                 <label htmlFor="create-metric-domain">{translate('custom_metrics.domain')}</label>
                 <Creatable
+                  id="create-metric-domain"
                   onChange={this.handleDomainChange}
                   options={domains.map(domain => ({ label: domain, value: domain }))}
                   value={this.state.domain}
@@ -161,6 +162,7 @@ export default class Form extends React.PureComponent<Props, State> {
                 </label>
                 <Select
                   clearable={false}
+                  id="create-metric-type"
                   onChange={this.handleTypeChange}
                   options={this.props.types.map(type => ({
                     label: translate('metric.type', type),

diff --git a/server/sonar-web/src/main/js/apps/custom-metrics/components/__tests__/__snapshots__/Form-test.tsx.snap b/server/sonar-web/src/main/js/apps/custom-metrics/components/__tests__/__snapshots__/Form-test.tsx.snap
index f0baf33640e88c33fa3825d2505ab0f0f4a2c435..69ff6188f6b949324be0aa460613ce2372935175 100644 (file)
--- a/server/sonar-web/src/main/js/apps/custom-metrics/components/__tests__/__snapshots__/Form-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/custom-metrics/components/__tests__/__snapshots__/Form-test.tsx.snap
@@ -89,6 +89,7 @@ exports[`should render form 1`] = `
           custom_metrics.domain
         </label>
         <Creatable
+          id="create-metric-domain"
           onChange={[Function]}
           options={
             Array [
@@ -119,6 +120,7 @@ exports[`should render form 1`] = `
         </label>
         <Select
           clearable={false}
+          id="create-metric-type"
           onChange={[Function]}
           options={
             Array [

diff --git a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.tsx b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.tsx
index 4fdf7d09f4671bebcc421d1c3b55dbfe22113dce..9578cbbaa56c241ee22849b70e6e4f43d6bdbbf5 100644 (file)
--- a/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.tsx
+++ b/server/sonar-web/src/main/js/apps/issues/components/BulkChangeModal.tsx
@@ -270,8 +270,12 @@ export default class BulkChangeModal extends React.PureComponent<Props, State> {
     </div>
   );
 
-  renderCheckbox = (field: keyof FormFields) => (
-    <Checkbox checked={this.state[field] !== undefined} onCheck={this.handleFieldCheck(field)} />
+  renderCheckbox = (field: keyof FormFields, id?: string) => (
+    <Checkbox
+      checked={this.state[field] !== undefined}
+      id={id}
+      onCheck={this.handleFieldCheck(field)}
+    />
   );
 
   renderAffected = (affected: number) => (
@@ -485,7 +489,7 @@ export default class BulkChangeModal extends React.PureComponent<Props, State> {
   renderNotificationsField = () => (
     <div className="modal-field">
       <label htmlFor="send-notifications">{translate('issue.send_notifications')}</label>
-      {this.renderCheckbox('notifications')}
+      {this.renderCheckbox('notifications', 'send-notifications')}
     </div>
   );
 

diff --git a/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/BulkChangeModal-test.tsx.snap b/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/BulkChangeModal-test.tsx.snap
index 120b9dff93b98c6404b4cb293bed84976af979f1..6ecd67855be34074b772360fdc08e5e1e8add152 100644 (file)
--- a/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/BulkChangeModal-test.tsx.snap
+++ b/server/sonar-web/src/main/js/apps/issues/components/__tests__/__snapshots__/BulkChangeModal-test.tsx.snap
@@ -75,6 +75,7 @@ exports[`should display form when issues are present 1`] = `
         </label>
         <Checkbox
           checked={false}
+          id="send-notifications"
           onCheck={[Function]}
           thirdState={false}
         />

diff --git a/server/sonar-web/src/main/js/apps/permissions/project/components/ApplyTemplate.tsx b/server/sonar-web/src/main/js/apps/permissions/project/components/ApplyTemplate.tsx
index 556f3928bd82951be9d3977466a80b6fee420b59..bd5538c91b08a3bc930ad8db96ed708a39253b4c 100644 (file)
--- a/server/sonar-web/src/main/js/apps/permissions/project/components/ApplyTemplate.tsx
+++ b/server/sonar-web/src/main/js/apps/permissions/project/components/ApplyTemplate.tsx
@@ -121,6 +121,7 @@ export default class ApplyTemplate extends React.PureComponent<Props, State> {
                       {this.state.permissionTemplates && (
                         <Select
                           clearable={false}
+                          id="project-permissions-template"
                           onChange={this.handlePermissionTemplateChange}
                           options={this.state.permissionTemplates.map(permissionTemplate => ({
                             label: permissionTemplate.name,

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionModal.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionModal.tsx
index e2778fe943f424c4cb7bd0995df231071e7ecadd..7284f830995b5bb2b09cd626af94ad6a35fbd76f 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionModal.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionModal.tsx
@@ -110,7 +110,7 @@ export default class ConditionModal extends React.PureComponent<Props, State> {
         onConfirm={this.handleFormSubmit}>
         {this.state.errorMessage && <Alert variant="error">{this.state.errorMessage}</Alert>}
         <div className="modal-field">
-          <label htmlFor="create-user-login">{translate('quality_gates.conditions.metric')}</label>
+          <label htmlFor="condition-metric">{translate('quality_gates.conditions.metric')}</label>
           {metrics && <MetricSelect metrics={metrics} onMetricChange={this.handleMetricChange} />}
           {this.props.metric && (
             <span className="note">{getLocalizedMetricName(this.props.metric)}</span>
@@ -119,7 +119,9 @@ export default class ConditionModal extends React.PureComponent<Props, State> {
         {metric && (
           <>
             <div className="modal-field">
-              <label>{translate('quality_gates.conditions.operator')}</label>
+              <label htmlFor="condition-operator">
+                {translate('quality_gates.conditions.operator')}
+              </label>
               <ConditionOperator
                 metric={metric}
                 onOperatorChange={this.handleOperatorChange}
@@ -127,7 +129,9 @@ export default class ConditionModal extends React.PureComponent<Props, State> {
               />
             </div>
             <div className="modal-field">
-              <label>{translate('quality_gates.conditions.error')}</label>
+              <label htmlFor="condition-threshold">
+                {translate('quality_gates.conditions.error')}
+              </label>
               <ThresholdInput
                 metric={metric}
                 name="error"

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionOperator.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionOperator.tsx
index ba7b8aca6c46af1bc18d8ffed94c0c07a1fe660e..de16855c471aeae36b1cf05fd977b125bd1cb6fd 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionOperator.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/ConditionOperator.tsx
@@ -53,6 +53,7 @@ export default class ConditionOperator extends React.PureComponent<Props> {
           autoFocus={true}
           className="input-medium"
           clearable={false}
+          id="condition-operator"
           name="operator"
           onChange={this.handleChange}
           options={operatorOptions}

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/MetricSelect.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/MetricSelect.tsx
index 60331a83d63ae2b3631f9a1ebbb45357b9dd4a76..17c3da58fcb67adb11ea2b720adb046c84d27629 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/MetricSelect.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/MetricSelect.tsx
@@ -75,6 +75,7 @@ export default class MetricSelect extends React.PureComponent<Props, State> {
     return (
       <Select
         className="text-middle input-large"
+        id="condition-metric"
         onChange={this.handleChange}
         options={optionsWithDomains}
         placeholder={translate('search.search_for_metrics')}

diff --git a/server/sonar-web/src/main/js/apps/quality-gates/components/ThresholdInput.tsx b/server/sonar-web/src/main/js/apps/quality-gates/components/ThresholdInput.tsx
index 8ad5c47736b86ce484265943d8630dc616e3cd62..968250fc03ab4370954eddcd61d53cb55a0aa1b6 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-gates/components/ThresholdInput.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-gates/components/ThresholdInput.tsx
@@ -54,6 +54,7 @@ export default class ThresholdInput extends React.PureComponent<Props> {
       <Select
         className="input-tiny text-middle"
         clearable={true}
+        id="condition-threshold"
         name={name}
         onChange={this.handleSelectChange}
         options={options}
@@ -75,6 +76,7 @@ export default class ThresholdInput extends React.PureComponent<Props> {
       <input
         className="input-tiny text-middle"
         data-type={metric.type}
+        id="condition-threshold"
         name={name}
         onChange={this.handleChange}
         type="text"

diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeParentForm.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeParentForm.tsx
index 31877770ca8447a6332f48301b078fb74ad41eb4..e44df26c5b517a995c2c4f830d31e44d3a0ba398 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeParentForm.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/details/ChangeParentForm.tsx
@@ -107,6 +107,7 @@ export default class ChangeParentForm extends React.PureComponent<Props, State>
               </label>
               <Select
                 clearable={false}
+                id="change-profile-parent"
                 name="parentKey"
                 onChange={this.handleSelectChange}
                 options={options}

diff --git a/server/sonar-web/src/main/js/apps/quality-profiles/home/CreateProfileForm.tsx b/server/sonar-web/src/main/js/apps/quality-profiles/home/CreateProfileForm.tsx
index e062afb02476a48b7876a68a25f8846a174d2449..cb315fb940041827ca0a80f064cf2dbc3748376c 100644 (file)
--- a/server/sonar-web/src/main/js/apps/quality-profiles/home/CreateProfileForm.tsx
+++ b/server/sonar-web/src/main/js/apps/quality-profiles/home/CreateProfileForm.tsx
@@ -142,6 +142,7 @@ export default class CreateProfileForm extends React.PureComponent<Props, State>
                 </label>
                 <Select
                   clearable={false}
+                  id="create-profile-language"
                   name="language"
                   onChange={this.handleLanguageChange}
                   options={languages.map(language => ({

diff --git a/server/sonar-web/src/main/js/apps/settings/components/EmailForm.tsx b/server/sonar-web/src/main/js/apps/settings/components/EmailForm.tsx
index d4aab3f1906032a018d1fb36e88cdbe953b3ff5f..19ad53f17b2cb96aaa8e1637391384ca81c34a64 100644 (file)
--- a/server/sonar-web/src/main/js/apps/settings/components/EmailForm.tsx
+++ b/server/sonar-web/src/main/js/apps/settings/components/EmailForm.tsx
@@ -150,7 +150,7 @@ class EmailForm extends React.PureComponent<Props, State> {
             <textarea
               className="settings-large-input"
               disabled={this.state.loading}
-              id="test-email-title"
+              id="test-email-message"
               onChange={this.onMessageChange}
               required={true}
               rows={5}