A11y: Fix a11y for toolbar buttons in PanelEditor (#53864)

Co-authored-by: Vadim Beskrovnov <vbeskrovnov@fb.com>

packages/grafana-e2e-selectors/src/selectors/components.ts

@@ -123,7 +123,7 @@ export const Components = {
     DataPane: {
       content: 'Panel editor data pane content',
     },
-    applyButton: 'panel editor apply',
+    applyButton: 'Apply changes and go back to dashboard',
     toggleVizPicker: 'toggle-viz-picker',
     toggleVizOptions: 'toggle-viz-options',
     toggleTableView: 'toggle-table-view',

public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx

@@ -338,32 +338,31 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
       <ToolbarButton
         icon="cog"
         onClick={this.onOpenDashboardSettings}
-        title="Open dashboard settings"
+        tooltip="Open dashboard settings"
         key="settings"
       />,
-      <ToolbarButton onClick={this.onDiscard} title="Undo all changes" key="discard">
+      <ToolbarButton onClick={this.onDiscard} tooltip="Undo all changes" key="discard">
         Discard
       </ToolbarButton>,
       this.props.panel.libraryPanel ? (
         <ToolbarButton
           onClick={this.onSaveLibraryPanel}
           variant="primary"
-          title="Apply changes and save library panel"
+          tooltip="Apply changes and save library panel"
           key="save-panel"
         >
           Save library panel
         </ToolbarButton>
       ) : (
-        <ToolbarButton onClick={this.onSaveDashboard} title="Apply changes and save dashboard" key="save">
+        <ToolbarButton onClick={this.onSaveDashboard} tooltip="Apply changes and save dashboard" key="save">
           Save
         </ToolbarButton>
       ),
       <ToolbarButton
         onClick={this.onBack}
         variant="primary"
-        title="Apply changes and go back to dashboard"
+        tooltip="Apply changes and go back to dashboard"
         key="apply"
-        aria-label={selectors.components.PanelEditor.applyButton}
       >
         Apply
       </ToolbarButton>,

public/app/features/dashboard/containers/DashboardPage.test.tsx

@@ -238,7 +238,7 @@ describe('DashboardPage', () => {
     });
 
     it('Should render panel editor', () => {
-      expect(screen.getByTitle('Apply changes and go back to dashboard')).toBeInTheDocument();
+      expect(screen.getByLabelText('Apply changes and go back to dashboard')).toBeInTheDocument();
     });
 
     it('Should reset state when leaving', () => {