E2E: Adds tests for QueryVariable CRUD (#20448)

* WIP: Adds basic template variables CRUD start

* e2eTests: Adds aria-labels in VariableEditorCtrl

* Refactor: Simplifies a bit

* e2eTests: Adds first Template Variable CRUD for QueryVariable

* Tests: Adds ArrayPageOjbectType

* Tests: Adds createQueryVariable method

* Tests: Refactor CRUD test

* Tests: Adds datasource and dashboard to scenario

* Refactor: Fixes type errors

* Refactor: Move pages to toolkit
This commit is contained in:
Hugo Häggmark
2019-11-25 07:29:01 +01:00
committed by GitHub
parent 31f4dea3d0
commit 2c2ed8371d
39 changed files with 910 additions and 317 deletions

View File

@@ -1,22 +1,18 @@
// Libaries
import React, { PureComponent } from 'react';
import { connect } from 'react-redux';
// Utils & Services
import { appEvents } from 'app/core/app_events';
import { PlaylistSrv } from 'app/features/playlist/playlist_srv';
// Components
import { DashNavButton } from './DashNavButton';
import { DashNavTimeControls } from './DashNavTimeControls';
import { Tooltip } from '@grafana/ui';
// State
import { updateLocation } from 'app/core/actions';
// Types
import { DashboardModel } from '../../state';
import { StoreState, CoreEvents } from 'app/types';
import { CoreEvents, StoreState } from 'app/types';
export interface OwnProps {
dashboard: DashboardModel;
@@ -160,7 +156,11 @@ export class DashNav extends PureComponent<Props> {
return (
<div className="navbar-edit">
<Tooltip content="Go back (Esc)">
<button className="navbar-edit__back-btn" onClick={this.onClose}>
<button
className="navbar-edit__back-btn"
onClick={this.onClose}
aria-label="Dashboard settings Go Back button"
>
<i className="fa fa-arrow-left" />
</button>
</Tooltip>

View File

@@ -1,14 +1,24 @@
<aside class="dashboard-settings__aside">
<a href="{{::section.url}}" class="dashboard-settings__nav-item" ng-class="{active: ctrl.viewId === section.id}" ng-repeat="section in ctrl.sections">
<a href="{{::section.url}}" class="dashboard-settings__nav-item" ng-class="{active: ctrl.viewId === section.id}" ng-repeat="section in ctrl.sections" aria-label="{{'Dashboard settings section ' + section.title}}">
<i class="{{::section.icon}}"></i>
{{::section.title}}
</a>
<div class="dashboard-settings__aside-actions">
<button class="btn btn-primary" ng-click="ctrl.saveDashboard()" ng-show="ctrl.canSave">
<button
class="btn btn-primary"
ng-click="ctrl.saveDashboard()"
ng-show="ctrl.canSave"
aria-label="Dashboard settings aside actions Save button"
>
Save
</button>
<button class="btn btn-inverse" ng-click="ctrl.openSaveAsModal()" ng-show="ctrl.canSaveAs">
<button
class="btn btn-inverse"
ng-click="ctrl.openSaveAsModal()"
ng-show="ctrl.canSaveAs"
aria-label="Dashboard settings aside actions Save As button"
>
Save As...
</button>
</div>

View File

@@ -57,6 +57,7 @@ const template = `
class="btn btn-primary"
ng-class="{'btn-primary--processing': ctrl.isSaving}"
ng-disabled="ctrl.saveForm.$invalid || ctrl.isSaving"
aria-label="Dashboard settings Save Dashboard Modal Save button"
>
<span ng-if="!ctrl.isSaving">Save</span>
<span ng-if="ctrl.isSaving === true">Saving...</span>

View File

@@ -1,9 +1,11 @@
<div class="submenu-controls">
<div ng-repeat="variable in ctrl.variables" ng-hide="variable.hide === 2" class="submenu-item gf-form-inline">
<div class="gf-form">
<label class="gf-form-label template-variable" ng-hide="variable.hide === 1">
{{variable.label || variable.name}}
</label>
<label
class="gf-form-label template-variable"
ng-hide="variable.hide === 1"
aria-label="Dashboard template variables submenu LabelName label"
>{{variable.label || variable.name}}</label>
<value-select-dropdown ng-if="variable.type !== 'adhoc' && variable.type !== 'textbox'" dashboard="ctrl.dashboard" variable="variable" on-updated="ctrl.variableUpdated(variable)"></value-select-dropdown>
<input type="text" ng-if="variable.type === 'textbox'" ng-model="variable.query" class="gf-form-input width-12" ng-blur="variable.current.value != variable.query && variable.updateOptions() && ctrl.variableUpdated(variable);" ng-keydown="$event.keyCode === 13 && variable.current.value != variable.query && variable.updateOptions() && ctrl.variableUpdated(variable);" ></input>
</div>