directories.ts 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678
  1. /**
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing,
  13. * software distributed under the License is distributed on an
  14. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15. * KIND, either express or implied. See the License for the
  16. * specific language governing permissions and limitations
  17. * under the License.
  18. */
  19. const dataTestLocator = (value: string) => `[data-test='${value}']`;
  20. export function dataTestChartName(chartName: string): string {
  21. return `[data-test-chart-name='${chartName}']`;
  22. }
  23. export const pageHeader = {
  24. logo: '.navbar-brand > img',
  25. headerNavigationItem: '.ant-menu-submenu-title',
  26. headerNavigationDropdown: "[aria-label='triangle-down']",
  27. headerNavigationItemMenu: '.ant-menu-item-group-list',
  28. plusIcon: ':nth-child(2) > .ant-menu-submenu-title',
  29. plusIconMenuOptions: {
  30. sqlQueryOption: dataTestLocator('menu-item-SQL query'),
  31. chartOption: dataTestLocator('menu-item-Chart'),
  32. dashboardOption: dataTestLocator('menu-item-Dashboard'),
  33. },
  34. plusMenu: '.ant-menu-submenu-popup',
  35. barButtons: '[role="presentation"]',
  36. sqlLabMenu: '[id="item_3$Menu"]',
  37. dataMenu: '[id="item_4$Menu"]',
  38. };
  39. export const profile = {
  40. activeTab: '.ant-tabs-tab-active',
  41. inactiveTab: '.ant-tabs-tab',
  42. emptyFavoritedPlaceholder: '.ant-empty-normal',
  43. tableRow: '.table-row',
  44. favoritesSpace: '#rc-tabs-0-panel-2',
  45. };
  46. export const securityAccess = {
  47. rolesBubble: '.ant-badge-count',
  48. };
  49. export const homePage = {
  50. homeSection: {
  51. sectionArea: '.ant-collapse-content-box',
  52. sectionElement: '.ant-card-meta-title',
  53. },
  54. sections: {
  55. expandedSection: '.ant-collapse-item-active',
  56. expandedSectionHeader: '[aria-expanded="true"]',
  57. collapseExpandButton: '.ant-collapse-arrow',
  58. collapsedSection: '[class="ant-collapse-item"]',
  59. collapsedSectionHeader: '[aria-expanded="false"]',
  60. section: '[class^="ant-collapse-item"]',
  61. sectionsMenuContainer: "[role='navigation']",
  62. sectionsMenuItem: "[role='menuitem']",
  63. card: dataTestLocator('styled-card'),
  64. },
  65. thumbnailsSection: {
  66. container: "[class='switch']",
  67. toggle: "[role ='switch']",
  68. },
  69. };
  70. export const databasesPage = {
  71. addDatabaseButton: dataTestLocator('btn-create-database'),
  72. searchInput: dataTestLocator('search-input'),
  73. table: {
  74. tableRow: dataTestLocator('table-row'),
  75. tableCell: dataTestLocator('table-row-cell'),
  76. editButton: dataTestLocator('edit-alt'),
  77. },
  78. modal: {
  79. header: '#rcDialogTitle0 > h4',
  80. step: '.helper-top',
  81. selectDbStepTitle: '.select-db > h4',
  82. preferredBlockBigQuery: '.preferred > :nth-child(1)',
  83. preferredBlockPostgreSQL: '.preferred > :nth-child(2)',
  84. preferredBlockSnowflake: '.preferred > :nth-child(3)',
  85. preferredBlockMySQL: '.preferred > :nth-child(4)',
  86. preferredBlockAthena: '.preferred > :nth-child(5)',
  87. preferredBlockSheets: '.preferred > :nth-child(6)',
  88. supportedDatabasesText: '.control-label',
  89. orChoose: '.available-label',
  90. dbDropdown: '[class="ant-select-selection-search-input"]',
  91. dbDropdownMenu: '.rc-virtual-list-holder-inner',
  92. dbDropdownMenuItem: '[class="ant-select-item-option-content"]',
  93. infoAlert: '.ant-alert',
  94. serviceAccountInput: '[name="credentials_info"]',
  95. connectionStep: {
  96. modal: '.ant-modal-content',
  97. modalBody: '.ant-modal-body',
  98. stepTitle: '.css-7x6kk > h4',
  99. helperBottom: '.helper-bottom',
  100. postgresDatabase: '[name="database"]',
  101. dbInput: '[name="database_name"]',
  102. alertMessage: '.ant-alert-message',
  103. errorField: '[role="alert"]',
  104. uploadJson: '[title="Upload JSON file"]',
  105. chooseFile: '[class="ant-btn input-upload-btn"]',
  106. additionalParameters: '[name="query_input"]',
  107. sqlAlchemyUriInput: dataTestLocator('sqlalchemy-uri-input'),
  108. advancedTab: '#rc-tabs-0-tab-2',
  109. activeTab: '.ant-tabs-tab-active',
  110. securitySubMenu:
  111. ':nth-child(3) > .ant-collapse-header > .anticon > svg > path',
  112. aceTextInput: '.ace_text-input',
  113. aceContent: '.ace_content',
  114. connectButton: '.css-16i3wh7',
  115. hostInput: '[name="host"]',
  116. portInput: '[name="port"]',
  117. usernameInput: '[name="username"]',
  118. passwordInput: '[name="password"]',
  119. switch: '.ant-switch',
  120. },
  121. },
  122. };
  123. export const sqlLabView = {
  124. sqlEditorLeftBar: {
  125. sqlEditorLeftBar: '[data-test="sql-editor-left-bar"]',
  126. databaseSchemaTableSection:
  127. '[data-test="sql-editor-left-bar"] > :nth-child(1)',
  128. tableSchemaSection:
  129. '[data-test="sql-editor-left-bar"] > :nth-child(1) > :nth-child(3) > :nth-child(1)',
  130. tableSchemaInputEmpty: '[aria-label="Select table or type table name"]',
  131. },
  132. databaseInput: '[data-test=DatabaseSelector] > :nth-child(1)',
  133. emptyMenuOptionsPlaceholder: '[class="ant-empty-img-simple"]',
  134. removeTabButton: '.ant-tabs-tab-remove > .anticon > svg',
  135. tabsNavList: "[class='ant-tabs-nav-list']",
  136. tab: "[class='ant-tabs-tab-btn']",
  137. addTabButton: dataTestLocator('add-tab-icon'),
  138. tooltip: '.ant-tooltip-content',
  139. tabName: '.css-1suejie',
  140. schemaInput: '[data-test=DatabaseSelector] > :nth-child(2)',
  141. loadingIndicator: '.Select__loading-indicator',
  142. menuItem: '[class="ant-select-item-option-content"]',
  143. examplesMenuItem: '[title="examples"]',
  144. tableInput: ':nth-child(4) > .select > :nth-child(1)',
  145. sqlEditor: '#brace-editor textarea',
  146. saveAsButton: '.SaveQuery > .ant-btn',
  147. saveAsModal: {
  148. footer: '.ant-modal-footer',
  149. queryNameInput: 'input[class^="ant-input"]',
  150. },
  151. sqlToolbar: {
  152. toolbar: '#js-sql-toolbar',
  153. runButton: '.css-d3dxop',
  154. },
  155. rowsLimit: {
  156. dropdown: '.ant-dropdown-menu',
  157. limitButton: '.ant-dropdown-menu-item',
  158. limitButtonText: '.css-151uxnz',
  159. limitTextWithValue: '[class="ant-dropdown-trigger"]',
  160. },
  161. renderedTableHeader: '.ReactVirtualized__Table__headerRow',
  162. renderedTableRow: '.ReactVirtualized__Table__row',
  163. errorBody: '.error-body',
  164. alertMessage: '.ant-alert-message',
  165. historyTable: {
  166. header: '[role=columnheader]',
  167. table: '.QueryTable',
  168. row: dataTestLocator('table-row'),
  169. failureMarkIcon: '[aria-label=close]',
  170. successMarkIcon: '[aria-label=check]',
  171. },
  172. };
  173. export const queryHistory = {
  174. tableHeader: dataTestLocator('sort-header'),
  175. row: dataTestLocator('table-row'),
  176. cell: dataTestLocator('table-row-cell'),
  177. action: '[aria-label=full]',
  178. };
  179. export const savedQuery = {
  180. tableHeader: dataTestLocator('sort-header'),
  181. row: dataTestLocator('table-row'),
  182. cell: dataTestLocator('table-row-cell'),
  183. trash: dataTestLocator('delete-action'),
  184. deleteQueryIcon: '[data-test="delete-action"]',
  185. deleteModal: {
  186. deleteInput: dataTestLocator('delete-modal-input'),
  187. deleteButton: dataTestLocator('modal-confirm-button'),
  188. },
  189. };
  190. export const annotationLayersView = {
  191. emptyDescription: {
  192. description: '.ant-empty-description',
  193. addAnnotationLayerButton: '.ant-empty-footer > .ant-btn',
  194. },
  195. modal: {
  196. content: {
  197. content: '.ant-modal-body',
  198. title: '.ant-modal-body > :nth-child(2) > input',
  199. description: "[name='descr']",
  200. },
  201. footer: {
  202. footer: '.ant-modal-footer',
  203. addButton: dataTestLocator('modal-confirm-button'),
  204. cancelButton: dataTestLocator('modal-cancel-button'),
  205. },
  206. },
  207. };
  208. export const datasetsList = {
  209. newDatasetButton: '.css-yff34v',
  210. searchInput: dataTestLocator('filters-search'),
  211. newDatasetModal: {
  212. inputField: '[class="section"]',
  213. addButton: dataTestLocator('modal-confirm-button'),
  214. body: '.ant-modal-body',
  215. },
  216. table: {
  217. tableRow: {
  218. row: dataTestLocator('table-row'),
  219. rowText: dataTestLocator('cell-text'),
  220. rowCell: dataTestLocator('table-row-cell'),
  221. },
  222. tableRowHeader: {
  223. header: dataTestLocator('sort-header'),
  224. unsorted: '[aria-label="sort"]',
  225. sortAsc: '[aria-label="sort-asc"]',
  226. sortDesc: '[aria-label="sort-desc"]',
  227. },
  228. rowActionItems: dataTestLocator('table-row-cell'),
  229. actionButton: '.action-button',
  230. editButton: '[aria-label="edit-alt"]',
  231. },
  232. editDatasetModal: {
  233. modal: dataTestLocator('edit-dataset-tabs'),
  234. sourceNavigationTab: '#table-tabs-tab-0',
  235. metricsNavigationTab: dataTestLocator('collection-tab-Metrics'),
  236. columnsNavigationTab: dataTestLocator('collection-tab-Columns'),
  237. calculatedColumnsNavigationTab: dataTestLocator(
  238. 'collection-tab-Calculated columns',
  239. ),
  240. settingsNavigationTab: '#table-tabs-tab-4',
  241. saveButton: dataTestLocator('datasource-modal-save'),
  242. sourceContent: '#table-tabs-panel-0',
  243. metricsContent: '#table-tabs-panel-1',
  244. columnsContent: '#table-tabs-panel-2',
  245. calculatedColumnsContent: '#table-tabs-panel-3',
  246. settingsContent: '#table-tabs-panel-4',
  247. aceTextInput: '.ace_text-input',
  248. sourceSQLInput: '.ace_content',
  249. sourceVirtualSQLRadio: ':nth-child(2) > .ant-radio > .ant-radio-inner',
  250. sourcePadlock: '[aria-label=lock]',
  251. legacy: {
  252. panel: '.panel-body',
  253. sqlInput: '#sql',
  254. save: '.well > .btn-primary',
  255. description: '#description',
  256. },
  257. },
  258. deleteDatasetModal: {
  259. modal: '.ant-modal-content',
  260. deleteInput: dataTestLocator('delete-modal-input'),
  261. deleteButton: dataTestLocator('modal-confirm-button'),
  262. text: '.css-kxmt87',
  263. },
  264. };
  265. export const chartListView = {
  266. filtersBar: {
  267. searchField: dataTestLocator('filters-search'),
  268. },
  269. top: {
  270. bulkSelect: dataTestLocator('bulk-select'),
  271. },
  272. header: {
  273. cardView: '[aria-label="card-view"]',
  274. listView: '[aria-label="list-view"]',
  275. sort: '[class="ant-select-selection-search-input"][aria-label="Sort"]',
  276. sortRecentlyModifiedMenuOption: '[label="Recently modified"]',
  277. sortAlphabeticalMenuOption: '[label="Alphabetical"]',
  278. sortDropdown: '.Select__menu',
  279. },
  280. card: {
  281. card: dataTestLocator('styled-card'),
  282. cardCover: '[class="ant-card-cover"]',
  283. cardImage: '[class="gradient-container"]',
  284. starIcon: dataTestLocator('fave-unfave-icon'),
  285. },
  286. deleteModal: {
  287. deleteInput: dataTestLocator('delete-modal-input'),
  288. deleteButton: dataTestLocator('modal-confirm-button'),
  289. },
  290. table: {
  291. bulkSelect: {
  292. checkboxOff: 'input[type="checkbox"]:checked',
  293. checkboxOn: 'input[type="checkbox"]:not(:checked)',
  294. action: dataTestLocator('bulk-select-action'),
  295. },
  296. tableList: dataTestLocator('listview-table'),
  297. table: '[role="rowgroup"]',
  298. tableRowHeader: {
  299. header: dataTestLocator('sort-header'),
  300. unsorted: '[aria-label="sort"]',
  301. sortAsc: '[aria-label="sort-asc"]',
  302. sortDesc: '[aria-label="sort-desc"]',
  303. },
  304. tableRow: {
  305. row: dataTestLocator('table-row'),
  306. rowText: dataTestLocator('cell-text'),
  307. rowCell: dataTestLocator('table-row-cell'),
  308. },
  309. },
  310. addChartButton: '.css-yff34v',
  311. };
  312. export const nativeFilters = {
  313. modal: {
  314. container: '.ant-modal',
  315. footer: '.ant-modal-footer',
  316. saveButton: dataTestLocator('native-filter-modal-save-button'),
  317. cancelButton: dataTestLocator('native-filter-modal-cancel-button'),
  318. confirmCancelButton: dataTestLocator(
  319. 'native-filter-modal-confirm-cancel-button',
  320. ),
  321. alertXUnsavedFilters: '.ant-alert-message',
  322. tabsList: {
  323. filterItemsContainer: dataTestLocator('filter-title-container'),
  324. tabsContainer: '[class="ant-tabs-nav-list"]',
  325. tab: '.ant-tabs-tab',
  326. removeTab: '[aria-label="delete"]',
  327. },
  328. addFilter: dataTestLocator('add-filter-button'),
  329. defaultValueCheck: '.ant-checkbox-checked',
  330. addNewFilterButton: dataTestLocator('add-new-filter-button'),
  331. addNewDividerButton: dataTestLocator('add-new-divider-button'),
  332. },
  333. filtersPanel: {
  334. filterName: dataTestLocator('filters-config-modal__name-input'),
  335. datasetName: dataTestLocator('filters-config-modal__datasource-input'),
  336. filterInfoInput: '.ant-select-selection-search-input',
  337. inputDropdown: '.ant-select-item-option-content',
  338. columnEmptyInput: '.ant-select-selection-placeholder',
  339. filterTypeInput: dataTestLocator('filters-config-modal__filter-type'),
  340. fieldInput: dataTestLocator('field-input'),
  341. filterTypeItem: '.ant-select-selection-item',
  342. filterGear: dataTestLocator('filterbar-orientation-icon'),
  343. },
  344. filterFromDashboardView: {
  345. filterValueInput: '[class="ant-select-selection-search-input"]',
  346. expand: dataTestLocator('filter-bar__expand-button'),
  347. collapse: dataTestLocator('filter-bar__collapse-button'),
  348. filterName: dataTestLocator('filter-control-name'),
  349. filterContent: '.ant-select-selection-item',
  350. createFilterButton: dataTestLocator('filter-bar__create-filter'),
  351. timeRangeFilterContent: dataTestLocator('time-range-trigger'),
  352. },
  353. createFilterButton: dataTestLocator('filter-bar__create-filter'),
  354. removeFilter: '[aria-label="remove"]',
  355. silentLoading: '.loading inline-centered css-101mkpk',
  356. filterConfigurationSections: {
  357. sectionHeader: '.ant-collapse-header',
  358. displayedSection: 'div[style="height: 100%; overflow-y: auto;"]',
  359. collapseExpandButton: '.ant-collapse-arrow',
  360. checkedCheckbox: '.ant-checkbox-wrapper-checked',
  361. infoTooltip: '[aria-label="Show info tooltip"]',
  362. parentFilterInput: dataTestLocator('parent-filter-input'),
  363. filterPlaceholder: '.ant-select-selection-placeholder',
  364. collapsedSectionContainer: '[class="ant-collapse-content-box"]',
  365. },
  366. filtersList: {
  367. list: '.ant-tabs-nav-list',
  368. listItemNotActive: '[class="ant-tabs-tab ant-tabs-tab-with-remove"]',
  369. listItemActive:
  370. '[class="ant-tabs-tab ant-tabs-tab-with-remove ant-tabs-tab-active"]',
  371. removeIcon: '[aria-label="delete"]',
  372. },
  373. filterItem: dataTestLocator('form-item-value'),
  374. filterItemDropdown: '.ant-select-selection-search',
  375. applyFilter: dataTestLocator('filter-bar__apply-button'),
  376. defaultInput: dataTestLocator('default-input'),
  377. filterIcon: dataTestLocator('filter-icon'),
  378. slider: {
  379. slider: '[class="ant-slider"]',
  380. startHandle: '[class="ant-slider-handle ant-slider-handle-1"]',
  381. endHandle: '[class="ant-slider-handle ant-slider-handle-2"]',
  382. sliderText: '[class="ant-slider-mark-text ant-slider-mark-text-active"]',
  383. },
  384. };
  385. export const dashboardListView = {
  386. dashboardListView: dataTestLocator('dashboard-list-view'),
  387. editItemAction: dataTestLocator('edit-alt'),
  388. filtersBar: {
  389. searchField: dataTestLocator('filters-search'),
  390. },
  391. top: {
  392. bulkSelect: dataTestLocator('bulk-select'),
  393. },
  394. card: {
  395. card: dataTestLocator('styled-card'),
  396. cardCover: '[class="ant-card-cover"]',
  397. cardImage: '[class="gradient-container"]',
  398. selectedStarIcon: "[aria-label='star']",
  399. unselectedStarIcon: "[aria-label='star']",
  400. starIcon: dataTestLocator('fave-unfave-icon'),
  401. },
  402. deleteModal: {
  403. deleteInput: dataTestLocator('delete-modal-input'),
  404. deleteButton: dataTestLocator('modal-confirm-button'),
  405. },
  406. table: {
  407. starIcon: dataTestLocator('fave-unfave-icon'),
  408. selectedStarIcon: "[aria-label='star']",
  409. unselectedStarIcon: "[aria-label='star']",
  410. bulkSelect: {
  411. checkboxOff: '[aria-label="checkbox-off"]',
  412. checkboxOn: '[aria-label="checkbox-on"]',
  413. action: dataTestLocator('bulk-select-action'),
  414. },
  415. tableRow: {
  416. sortHeader: dataTestLocator('sort-header'),
  417. row: dataTestLocator('table-row'),
  418. rowText: dataTestLocator('cell-text'),
  419. rowCell: dataTestLocator('table-row-cell'),
  420. },
  421. tableRowList: '[role="rowgroup"]',
  422. tableList: dataTestLocator('listview-table'),
  423. trashIcon: dataTestLocator('dashboard-list-trash-icon'),
  424. },
  425. actions: {
  426. importButton: dataTestLocator('import-button'),
  427. newDashboardButton: '.css-yff34v',
  428. },
  429. importModal: {
  430. selectFileButton: '.ant-upload > .ant-btn > span',
  431. importButton: dataTestLocator('modal-confirm-button'),
  432. },
  433. header: {
  434. cardView: '[aria-label="appstore"]',
  435. listView: '[aria-label="unordered-list"]',
  436. sort: dataTestLocator('sort-header'),
  437. sortDropdown: '.Select__menu',
  438. statusFilterInput: `${dataTestLocator(
  439. 'filters-select',
  440. )}[aria-label='Status']`,
  441. ownerFilterInput: `${dataTestLocator(
  442. 'filters-select',
  443. )}[aria-label='Owner']`,
  444. createdByFilterInput: `${dataTestLocator(
  445. 'filters-select',
  446. )}[aria-label='Created by']`,
  447. FavoriteFilterInput: `${dataTestLocator(
  448. 'filters-select',
  449. )}[aria-label='Favorite']`,
  450. searchFilterInput: `${dataTestLocator(
  451. 'filters-search',
  452. )}[name='dashboard_title']`,
  453. draftStatusFilterOption: "[title='Draft']",
  454. },
  455. };
  456. export const exploreView = {
  457. openDatasourceMenu: dataTestLocator('open-datasource-tab'),
  458. sectionsHeader: '.ant-collapse-header',
  459. datasourceMenuThreeDots: dataTestLocator('datasource-menu-trigger'),
  460. threeDotsMenuDropdown: {
  461. editDataset: dataTestLocator('edit-dataset'),
  462. },
  463. chartContainer: dataTestLocator('chart-container'),
  464. chartHeading: {
  465. queryMenu: '#query',
  466. viewQueryButton: dataTestLocator('view-query-menu-item'),
  467. shortLinkButton: dataTestLocator('short-link-button'),
  468. embedCodeButton: dataTestLocator('embed-code-button'),
  469. },
  470. chartAreaItem: '.nv-legend-text',
  471. viewQueryModal: {
  472. container: '.ant-modal-content',
  473. closeButton: 'button.ant-modal-close',
  474. },
  475. embedCodeModal: {
  476. container: dataTestLocator('embed-code-popover'),
  477. textfield: dataTestLocator('embed-code-textarea'),
  478. },
  479. saveModal: {
  480. modal: '.ant-modal-content',
  481. chartNameInput: dataTestLocator('new-chart-name'),
  482. dashboardNameInput: '.ant-select-selection-search-input',
  483. addToDashboardInput: dataTestLocator(
  484. 'save-chart-modal-select-dashboard-form',
  485. ),
  486. saveButton: dataTestLocator('btn-modal-save'),
  487. saveAsCircle: dataTestLocator('saveas-radio'),
  488. overwriteCircle: dataTestLocator('save-overwrite-radio'),
  489. saveAndGoToDashboard: '#btn_modal_save_goto_dash',
  490. },
  491. controlPanel: {
  492. panel: dataTestLocator('control-tabs'),
  493. categoryArea: '.ant-collapse-content-box',
  494. dragField: dataTestLocator('datasource'),
  495. metricsField: dataTestLocator('metrics'),
  496. optionField: dataTestLocator('option-label'),
  497. fieldInput: '.Select__control input',
  498. removeFieldValue: dataTestLocator('remove-control-button'),
  499. addFieldValue: '[aria-label="plus"]',
  500. vizType: dataTestLocator('visualization-type'),
  501. runButton: dataTestLocator('run-query-button'),
  502. saveQuery: dataTestLocator('query-save-button'),
  503. fieldValue: dataTestLocator('control-label'),
  504. addMetricModal: {
  505. container: dataTestLocator('metrics-edit-popover'),
  506. metricNameEdit: {
  507. editButton: dataTestLocator('AdhocMetricEditTitle#trigger'),
  508. input: dataTestLocator('AdhocMetricEditTitle#input'),
  509. },
  510. simpleTab: {
  511. tab: '#adhoc-metric-edit-tabs-tab-SIMPLE',
  512. columnInput: '[name="select-column"]',
  513. aggregateInput: '[name="select-aggregate"]',
  514. },
  515. customSQLTab: {
  516. tab: '#adhoc-metric-edit-tabs-tab-SQL',
  517. inputContainerField: '.ace_content',
  518. input: '.ace_text-input',
  519. },
  520. saveButton: dataTestLocator('AdhocMetricEdit#save'),
  521. },
  522. querySection: {
  523. groupByField: dataTestLocator('groupby'),
  524. filtersField: dataTestLocator('adhoc_filters'),
  525. filterValue: dataTestLocator('adhoc-filter-simple-value'),
  526. filterModal: {
  527. customSQL: {
  528. tab: '#adhoc-filter-edit-tabs-tab-SQL',
  529. inputArea: '.ace_content',
  530. input: '.ace_text-input',
  531. },
  532. simple: {
  533. tab: '#adhoc-filter-edit-tabs-tab-SIMPLE',
  534. },
  535. container: dataTestLocator('filter-edit-popover'),
  536. saveButton: dataTestLocator('adhoc-filter-edit-popover-save-button'),
  537. },
  538. },
  539. annotationLayerSection: {
  540. addAnnotationLayer: dataTestLocator('annotation_layers'),
  541. addAnnotationLayerModal: {
  542. container: dataTestLocator('popover-content'),
  543. name: dataTestLocator('annotation-layer-name-header'),
  544. formula: dataTestLocator('annotation-layer-value-header'),
  545. input: dataTestLocator(''),
  546. },
  547. },
  548. timeSection: {
  549. timeRangeFilter: dataTestLocator('time-range-trigger'),
  550. timeRangeFilterModal: {
  551. container: '.ant-popover-content',
  552. footer: '.footer',
  553. cancelButton: dataTestLocator('cancel-button'),
  554. configureLastTimeRange: {
  555. container: '.ant-radio-group',
  556. checkedItem: '.ant-radio-checked + span',
  557. },
  558. configureCustomTimeRange: {
  559. container: dataTestLocator('custom-frame'),
  560. timeInput: '.ant-input-number-input-wrap > input',
  561. },
  562. configureNoFilterTimeRange: {
  563. container: dataTestLocator('no-filter'),
  564. },
  565. },
  566. },
  567. advancedAnalyticsSection: {
  568. timeShift: {
  569. container: dataTestLocator('time_compare'),
  570. input: 'input[type=text]',
  571. selectedValues: '.Select__multi-value__label',
  572. },
  573. },
  574. },
  575. editDatasetModal: {
  576. container: '.ant-modal-content',
  577. datasetTabsContainer: dataTestLocator('edit-dataset-tabs'),
  578. saveButton: dataTestLocator('datasource-modal-save'),
  579. metricsTab: {
  580. addItem: dataTestLocator('crud-add-table-item'),
  581. rowsContainer: '.ant-table-body',
  582. },
  583. confirmModal: {
  584. okButton: '.ant-modal-confirm-btns .ant-btn-primary',
  585. },
  586. },
  587. visualizationTypeModal: {
  588. vizTypeButton: dataTestLocator('viztype-selector-container'),
  589. },
  590. };
  591. export const createChartView = {
  592. chooseDatasetInput: '.ant-select-selection-search-input',
  593. chooseDatasetOption: '.ant-select-item-option-content',
  594. chooseDatasetList: '.rc-virtual-list-holder-inner',
  595. tableVizType: "[alt='Table']",
  596. };
  597. export const editDashboardView = {
  598. dashboardName: dataTestLocator('dashboard-title-input'),
  599. dashboardEditingContainer: dataTestLocator('dashboard-content'),
  600. editComponent: dataTestLocator('new-component'),
  601. discardChanges: dataTestLocator('discard-changes-button'),
  602. chartBox: dataTestLocator('chart-grid-component'),
  603. tabsList: {
  604. tabsContainer: '[class="ant-tabs-nav-list"]',
  605. tab: '.ant-tabs-tab',
  606. },
  607. };
  608. export const dashboardView = {
  609. dashboardContainer: dataTestLocator('grid-container'),
  610. dashboardAlert: {
  611. modal: dataTestLocator('toast-container'),
  612. closeButton: dataTestLocator('close-button'),
  613. },
  614. saveModal: {
  615. modal: '.ant-modal-content',
  616. dashboardNameInput: '.ant-input',
  617. saveButton: dataTestLocator('modal-save-dashboard-button'),
  618. },
  619. dashboardProperties: {
  620. modal: '.ant-modal-content',
  621. dashboardTitleInput: dataTestLocator('dashboard-title-input'),
  622. modalButton: '[type="button"]',
  623. },
  624. chart: {
  625. trashIcon: dataTestLocator('dashboard-delete-component-button'),
  626. refreshChart: dataTestLocator('refresh-chart-menu-item'),
  627. },
  628. threeDotsMenuIcon:
  629. '.header-with-actions .right-button-panel .ant-dropdown-trigger',
  630. threeDotsMenuDropdown: dataTestLocator('header-actions-menu'),
  631. refreshDashboard: dataTestLocator('refresh-dashboard-menu-item'),
  632. saveAsMenuOption: dataTestLocator('save-as-menu-item'),
  633. dashboardTab: dataTestLocator('dragdroppable-object'),
  634. salesDashboardSpecific: {
  635. vehicleSalesFilterTimeRange: dataTestLocator('time-range-trigger'),
  636. secondTabSalesDashboard: dataTestLocator('dragdroppable-object'),
  637. },
  638. timeRangeModal: {
  639. rangeTypeField: '.ant-select-selection-item',
  640. startTimeInputNumber: '.ant-input-number-input',
  641. datePicker: '.ant-picker-input',
  642. applyButton: dataTestLocator('date-filter-control__apply-button'),
  643. radioGroup: '.ant-radio-group',
  644. radioButton: '.ant-radio',
  645. finalFilterRangePreviewCustom:
  646. '.css-c2bup7 > :nth-child(6) > :nth-child(2)',
  647. finalFilterRangePreviewLast: '.css-c2bup7 > :nth-child(7) > :nth-child(2)',
  648. finalFilterRangePreviewPrevious:
  649. '.css-c2bup7 > :nth-child(7) > :nth-child(2)',
  650. },
  651. treeMapChartModal: {
  652. selectItem: '.Select_control',
  653. selectItemInput: '.Select__control input[type=text]',
  654. applyButton: '.filter button:not(:disabled)',
  655. clearItemIcon: '.Select__clear-indicator',
  656. },
  657. sliceThreeDots: '[aria-label="More Options"]',
  658. sliceThreeDotsDropdown: '[role="menu"]',
  659. editDashboardButton: '[aria-label="Edit dashboard"]',
  660. starIcon: dataTestLocator('fave-unfave-icon'),
  661. dashboardHeader: dataTestLocator('dashboard-header'),
  662. dashboardSectionContainer: dataTestLocator(
  663. 'grid-row-background--transparent',
  664. ),
  665. markdownEditor: dataTestLocator('dashboard-markdown-editor'),
  666. dashboardComponent: dataTestLocator('dashboard-component-chart-holder'),
  667. tabsList: {
  668. tabsContainer: dataTestLocator('dashboard-component-tabs'),
  669. tabsNavList: dataTestLocator('nav-list'),
  670. tabs: '.ant-tabs-nav-list',
  671. tab: '.ant-tabs-tab',
  672. },
  673. };