diff --git a/packages/grafana-data/src/themes/createColors.ts b/packages/grafana-data/src/themes/createColors.ts
index 13fe35d85e3..c98098d54f8 100644
--- a/packages/grafana-data/src/themes/createColors.ts
+++ b/packages/grafana-data/src/themes/createColors.ts
@@ -96,7 +96,7 @@ class DarkColors implements ThemeColorsBase<Partial<ThemeRichColor>> {
   text = {
     primary: `rgb(${this.whiteBase})`,
     secondary: `rgba(${this.whiteBase}, 0.65)`,
-    disabled: `rgba(${this.whiteBase}, 0.58)`,
+    disabled: `rgba(${this.whiteBase}, 0.6)`,
     link: palette.blueDarkText,
     maxContrast: palette.white,
   };
diff --git a/packages/grafana-runtime/src/components/DataSourcePicker.tsx b/packages/grafana-runtime/src/components/DataSourcePicker.tsx
index fc2663d5249..3e1bff0ad29 100644
--- a/packages/grafana-runtime/src/components/DataSourcePicker.tsx
+++ b/packages/grafana-runtime/src/components/DataSourcePicker.tsx
@@ -38,6 +38,7 @@ export interface DataSourcePickerProps {
   // If set to true and there is no value select will be empty, otherwise it will preselect default data source
   noDefault?: boolean;
   width?: number;
+  inputId?: string;
   filter?: (dataSource: DataSourceInstanceSettings) => boolean;
   onClear?: () => void;
 }
@@ -147,7 +148,7 @@ export class DataSourcePicker extends PureComponent<DataSourcePickerProps, DataS
   }
 
   render() {
-    const { autoFocus, onBlur, onClear, openMenuOnFocus, placeholder, width } = this.props;
+    const { autoFocus, onBlur, onClear, openMenuOnFocus, placeholder, width, inputId } = this.props;
     const { error } = this.state;
     const options = this.getDataSourceOptions();
     const value = this.getCurrentValue();
@@ -157,7 +158,7 @@ export class DataSourcePicker extends PureComponent<DataSourcePickerProps, DataS
       <div aria-label={selectors.components.DataSourcePicker.container}>
         <Select
           aria-label={selectors.components.DataSourcePicker.inputV2}
-          inputId="data-source-picker"
+          inputId={inputId || 'data-source-picker'}
           menuShouldPortal
           className="ds-picker select-container"
           isMulti={false}
diff --git a/public/app/core/components/NodeGraphSettings.tsx b/public/app/core/components/NodeGraphSettings.tsx
index 9a2979474d5..669376a947e 100644
--- a/public/app/core/components/NodeGraphSettings.tsx
+++ b/public/app/core/components/NodeGraphSettings.tsx
@@ -31,6 +31,7 @@ export function NodeGraphSettings({ options, onOptionsChange }: Props) {
           labelWidth={26}
         >
           <InlineSwitch
+            id="enableNodeGraph"
             value={options.jsonData.nodeGraph?.enabled}
             onChange={(event: React.SyntheticEvent<HTMLInputElement>) =>
               updateDatasourcePluginJsonDataOption({ onOptionsChange, options }, 'nodeGraph', {
diff --git a/public/app/core/components/TraceToLogsSettings.tsx b/public/app/core/components/TraceToLogsSettings.tsx
index 40fc24f73e0..870e77858a5 100644
--- a/public/app/core/components/TraceToLogsSettings.tsx
+++ b/public/app/core/components/TraceToLogsSettings.tsx
@@ -39,6 +39,7 @@ export function TraceToLogsSettings({ options, onOptionsChange }: Props) {
       <InlineFieldRow>
         <InlineField tooltip="The data source the trace is going to navigate to" label="Data source" labelWidth={26}>
           <DataSourcePicker
+            inputId="trace-to-logs-data-source-picker"
             pluginId="loki"
             current={options.jsonData.tracesToLogs?.datasourceUid}
             noDefault={true}
@@ -124,6 +125,7 @@ export function TraceToLogsSettings({ options, onOptionsChange }: Props) {
           tooltip="Filters logs by Trace ID. Appends '|=<trace id>' to the query."
         >
           <InlineSwitch
+            id="filterByTraceID"
             value={options.jsonData.tracesToLogs?.filterByTraceID}
             onChange={(event: React.SyntheticEvent<HTMLInputElement>) =>
               updateDatasourcePluginJsonDataOption({ onOptionsChange, options }, 'tracesToLogs', {
@@ -143,6 +145,7 @@ export function TraceToLogsSettings({ options, onOptionsChange }: Props) {
           tooltip="Filters logs by Span ID. Appends '|=<span id>' to the query."
         >
           <InlineSwitch
+            id="filterBySpanID"
             value={options.jsonData.tracesToLogs?.filterBySpanID}
             onChange={(event: React.SyntheticEvent<HTMLInputElement>) =>
               updateDatasourcePluginJsonDataOption({ onOptionsChange, options }, 'tracesToLogs', {
@@ -156,6 +159,7 @@ export function TraceToLogsSettings({ options, onOptionsChange }: Props) {
       <InlineFieldRow>
         <InlineField label="Loki Search" labelWidth={26} grow tooltip="Use this logs data source to search for traces.">
           <InlineSwitch
+            id="lokiSearch"
             defaultChecked={true}
             value={options.jsonData.tracesToLogs?.lokiSearch}
             onChange={(event: React.SyntheticEvent<HTMLInputElement>) =>
diff --git a/public/app/plugins/datasource/jaeger/components/AdvancedOptions.tsx b/public/app/plugins/datasource/jaeger/components/AdvancedOptions.tsx
index dddf3682941..dff7cc564fc 100644
--- a/public/app/plugins/datasource/jaeger/components/AdvancedOptions.tsx
+++ b/public/app/plugins/datasource/jaeger/components/AdvancedOptions.tsx
@@ -37,6 +37,8 @@ export function AdvancedOptions({ query, onChange }: Props) {
           <InlineFieldRow>
             <InlineField label="Min Duration" labelWidth={21} grow>
               <Input
+                id="minDuration"
+                name="minDuration"
                 value={query.minDuration || ''}
                 placeholder={durationPlaceholder}
                 onChange={(v) =>
@@ -51,6 +53,8 @@ export function AdvancedOptions({ query, onChange }: Props) {
           <InlineFieldRow>
             <InlineField label="Max Duration" labelWidth={21} grow>
               <Input
+                id="maxDuration"
+                name="maxDuration"
                 value={query.maxDuration || ''}
                 placeholder={durationPlaceholder}
                 onChange={(v) =>
@@ -65,6 +69,8 @@ export function AdvancedOptions({ query, onChange }: Props) {
           <InlineFieldRow>
             <InlineField label="Limit" labelWidth={21} grow tooltip="Maximum numbers of returned results">
               <Input
+                id="limit"
+                name="limit"
                 value={query.limit || ''}
                 type="number"
                 onChange={(v) =>
diff --git a/public/app/plugins/datasource/jaeger/components/SearchForm.tsx b/public/app/plugins/datasource/jaeger/components/SearchForm.tsx
index affec4cce56..1c4e6de235b 100644
--- a/public/app/plugins/datasource/jaeger/components/SearchForm.tsx
+++ b/public/app/plugins/datasource/jaeger/components/SearchForm.tsx
@@ -54,6 +54,7 @@ export function SearchForm({ datasource, query, onChange }: Props) {
       <InlineFieldRow>
         <InlineField label="Service" labelWidth={14} grow>
           <Select
+            inputId="service"
             menuShouldPortal
             options={serviceOptions}
             value={serviceOptions?.find((v) => v.value === query.service) || null}
@@ -72,6 +73,7 @@ export function SearchForm({ datasource, query, onChange }: Props) {
       <InlineFieldRow>
         <InlineField label="Operation" labelWidth={14} grow disabled={!query.service}>
           <Select
+            inputId="operation"
             menuShouldPortal
             options={operationOptions}
             value={operationOptions?.find((v) => v.value === query.operation) || null}
@@ -89,6 +91,7 @@ export function SearchForm({ datasource, query, onChange }: Props) {
       <InlineFieldRow>
         <InlineField label="Tags" labelWidth={14} grow>
           <Input
+            id="tags"
             value={transformToLogfmt(query.tags)}
             placeholder="http.status_code=200 error=true"
             onChange={(v) =>
diff --git a/public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.tsx b/public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.tsx
index 84f199d8dce..dcf81762888 100644
--- a/public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.tsx
+++ b/public/app/plugins/datasource/tempo/QueryEditor/NativeSearch.tsx
@@ -128,6 +128,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
         <InlineFieldRow>
           <InlineField label="Service Name" labelWidth={14} grow>
             <Select
+              inputId="service"
               menuShouldPortal
               options={autocomplete.serviceNameOptions}
               value={query.serviceName || ''}
@@ -147,6 +148,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
         <InlineFieldRow>
           <InlineField label="Span Name" labelWidth={14} grow>
             <Select
+              inputId="spanName"
               menuShouldPortal
               options={autocomplete.spanNameOptions}
               value={query.spanName || ''}
@@ -187,6 +189,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
         <InlineFieldRow>
           <InlineField label="Min Duration" invalid={!!inputErrors.minDuration} labelWidth={14} grow>
             <Input
+              id="minDuration"
               value={query.minDuration || ''}
               placeholder={durationPlaceholder}
               onBlur={() => {
@@ -209,6 +212,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
         <InlineFieldRow>
           <InlineField label="Max Duration" invalid={!!inputErrors.maxDuration} labelWidth={14} grow>
             <Input
+              id="maxDuration"
               value={query.maxDuration || ''}
               placeholder={durationPlaceholder}
               onBlur={() => {
@@ -237,6 +241,7 @@ const NativeSearch = ({ datasource, query, onChange, onBlur, onRunQuery }: Props
             tooltip="Maximum numbers of returned results"
           >
             <Input
+              id="limit"
               value={query.limit || ''}
               type="number"
               onChange={(v) => {
diff --git a/public/app/plugins/datasource/tempo/configuration/SearchSettings.tsx b/public/app/plugins/datasource/tempo/configuration/SearchSettings.tsx
index 455f6388770..5cbd790d057 100644
--- a/public/app/plugins/datasource/tempo/configuration/SearchSettings.tsx
+++ b/public/app/plugins/datasource/tempo/configuration/SearchSettings.tsx
@@ -15,6 +15,7 @@ export function SearchSettings({ options, onOptionsChange }: Props) {
       <InlineFieldRow className={styles.row}>
         <InlineField tooltip="Removes the Search tab from the Tempo query editor." label="Hide search" labelWidth={26}>
           <InlineSwitch
+            id="hideSearch"
             value={options.jsonData.search?.hide}
             onChange={(event: React.SyntheticEvent<HTMLInputElement>) =>
               updateDatasourcePluginJsonDataOption({ onOptionsChange, options }, 'search', {
diff --git a/public/app/plugins/datasource/tempo/configuration/ServiceGraphSettings.tsx b/public/app/plugins/datasource/tempo/configuration/ServiceGraphSettings.tsx
index 5d3fbf0e6c7..557a3fc1890 100644
--- a/public/app/plugins/datasource/tempo/configuration/ServiceGraphSettings.tsx
+++ b/public/app/plugins/datasource/tempo/configuration/ServiceGraphSettings.tsx
@@ -25,6 +25,7 @@ export function ServiceGraphSettings({ options, onOptionsChange }: Props) {
           labelWidth={26}
         >
           <DataSourcePicker
+            inputId="service-graph-data-source-picker"
             pluginId="prometheus"
             current={options.jsonData.serviceMap?.datasourceUid}
             noDefault={true}
diff --git a/public/sass/_variables.dark.generated.scss b/public/sass/_variables.dark.generated.scss
index e38f9f97351..d8aacae634a 100644
--- a/public/sass/_variables.dark.generated.scss
+++ b/public/sass/_variables.dark.generated.scss
@@ -101,8 +101,8 @@ $text-color-strong: #FFFFFF;
 $text-color: rgb(204, 204, 220);
 $text-color-semi-weak: rgba(204, 204, 220, 0.65);
 $text-color-weak: rgba(204, 204, 220, 0.65);
-$text-color-faint: rgba(204, 204, 220, 0.58);
-$text-color-emphasis: #FFFFFF;
+$text-color-faint: rgba(204, 204, 220, 0.6);
+$text-color-emphasis: #fff;
 $text-blue: #6E9FFF;
 
 $text-shadow-faint: 1px 1px 4px rgb(45, 45, 45);
@@ -115,8 +115,8 @@ $brand-gradient-vertical: linear-gradient(#f05a28 30%, #fbca0a 99%);
 // Links
 // -------------------------
 $link-color: rgb(204, 204, 220);
-$link-color-disabled: rgba(204, 204, 220, 0.58);
-$link-hover-color: #FFFFFF;
+$link-color-disabled: rgba(204, 204, 220, 0.6);
+$link-hover-color: #fff;
 $external-link-color: #6E9FFF;
 
 // Typography
@@ -216,7 +216,7 @@ $input-border-color: rgba(204, 204, 220, 0.15);
 $input-box-shadow: none;
 $input-border-focus: #6E9FFF;
 $input-box-shadow-focus: #6E9FFF !default;
-$input-color-placeholder: rgba(204, 204, 220, 0.58);
+$input-color-placeholder: rgba(204, 204, 220, 0.6);
 $input-label-bg: #22252b;
 $input-color-select-arrow: $white;