Skip to content

Commit fd39e74

Browse files
[Console] Disable running onboarding tour by default (elastic#227978)
Closes elastic#212284 ## Summary This PR disables running the Console onboarding tour when opening the page for the first time. The tour can be still accessed by pressing the `Run getting started guide` button in the Help popover.
1 parent 790e994 commit fd39e74

10 files changed

Lines changed: 50 additions & 77 deletions

File tree

src/platform/plugins/shared/console/public/application/components/help_popover.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -76,18 +76,18 @@ export const HelpPopover = ({ button, isOpen, closePopover, resetTour }: HelpPop
7676
},
7777
},
7878
{
79-
label: i18n.translate('console.helpPopover.rerunTourLabel', {
80-
defaultMessage: 'Re-run feature tour',
79+
label: i18n.translate('console.helpPopover.runTourLabel', {
80+
defaultMessage: 'Start introduction tour',
8181
}),
8282
css: styles.listItem,
8383
onClick: resetTour,
8484
extraAction: {
85-
iconType: 'refresh',
85+
iconType: 'play',
8686
alwaysShow: true,
8787
onClick: resetTour,
88-
'data-test-subj': 'consoleRerunTourButton',
89-
'aria-label': i18n.translate('console.helpPopover.rerunTourButtonAriaLabel', {
90-
defaultMessage: 'Re-run feature tour button',
88+
'data-test-subj': 'consoleRunTourButton',
89+
'aria-label': i18n.translate('console.helpPopover.runTourButtonAriaLabel', {
90+
defaultMessage: 'Start introduction tour button',
9191
}),
9292
},
9393
},

src/platform/plugins/shared/console/public/application/containers/main/constants.ts

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,11 @@ export const HISTORY_TOUR_STEP = 3;
1717
export const CONFIG_TOUR_STEP = 4;
1818
export const FILES_TOUR_STEP = 5;
1919

20-
// Key used for storing tour state in local storage
21-
export const TOUR_STORAGE_KEY = 'consoleTour';
22-
2320
export const INITIAL_TOUR_CONFIG = {
2421
currentTourStep: 1,
25-
isTourActive: true,
22+
isTourActive: false,
2623
tourPopoverWidth: 360,
27-
tourSubtitle: 'Console onboarding', // Used for state in local storage
24+
tourSubtitle: 'Console onboarding',
2825
};
2926

3027
export const EXPORT_FILE_NAME = 'console_export';

src/platform/plugins/shared/console/public/application/containers/main/main.tsx

Lines changed: 4 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,6 @@ import {
5454
HISTORY_TAB_ID,
5555
CONFIG_TAB_ID,
5656
EDITOR_TOUR_STEP,
57-
TOUR_STORAGE_KEY,
5857
INITIAL_TOUR_CONFIG,
5958
FILES_TOUR_STEP,
6059
EXPORT_FILE_NAME,
@@ -84,13 +83,10 @@ export function Main({ currentTabProp, isEmbeddable = false }: MainProps) {
8483
services: { notifications, routeHistory },
8584
} = useServicesContext();
8685

87-
const storageTourState = localStorage.getItem(TOUR_STORAGE_KEY);
88-
const initialTourState = storageTourState ? JSON.parse(storageTourState) : INITIAL_TOUR_CONFIG;
89-
const [tourStepProps, actions, tourState] = useEuiTour(getTourSteps(docLinks), initialTourState);
90-
91-
useEffect(() => {
92-
localStorage.setItem(TOUR_STORAGE_KEY, JSON.stringify(tourState));
93-
}, [tourState]);
86+
const [tourStepProps, actions, tourState] = useEuiTour(
87+
getTourSteps(docLinks),
88+
INITIAL_TOUR_CONFIG
89+
);
9490

9591
// Clean up request output when switching tabs
9692
useEffect(() => {

src/platform/test/functional/apps/console/_onboarding_tour.ts

Lines changed: 35 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,13 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
1919
const PageObjects = getPageObjects(['common', 'console', 'header']);
2020
const testSubjects = getService('testSubjects');
2121

22-
// FLAKY: https://github.com/elastic/kibana/issues/224128
23-
describe.skip('console onboarding tour', function describeIndexTests() {
22+
describe('console onboarding tour', function describeIndexTests() {
2423
before(async () => {
2524
log.debug('navigateTo console');
2625
await PageObjects.common.navigateToApp('console');
2726
});
2827

2928
beforeEach(async () => {
30-
await browser.clearLocalStorage();
3129
await browser.refresh();
3230
});
3331

@@ -49,10 +47,32 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
4947
await PageObjects.common.sleep(DELAY_FOR);
5048
};
5149

50+
const runConsoleTour = async () => {
51+
await PageObjects.console.clickHelpIcon();
52+
await PageObjects.console.clickRunTour();
53+
await waitUntilFinishedLoading();
54+
};
55+
56+
it('should open the tour only when the run tour button has been pressed', async () => {
57+
await waitUntilFinishedLoading();
58+
59+
// Verify that tour is hidden
60+
await expectAllStepsHidden();
61+
62+
// Run tour
63+
await runConsoleTour();
64+
65+
// Verify that first tour step is visible
66+
expect(await isTourStepOpen('shellTourStep')).to.be(true);
67+
});
68+
5269
it('displays all five steps in the tour', async () => {
5370
const andWaitFor = DELAY_FOR;
5471
await waitUntilFinishedLoading();
5572

73+
// Run tour
74+
await runConsoleTour();
75+
5676
log.debug('on Shell tour step');
5777
expect(await isTourStepOpen('shellTourStep')).to.be(true);
5878
await PageObjects.console.clickNextTourStep(andWaitFor);
@@ -77,48 +97,41 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
7797

7898
// All steps should now be hidden
7999
await expectAllStepsHidden();
80-
81-
// Tour should not show after refreshing the browser
82-
await browser.refresh();
83-
await expectAllStepsHidden();
84-
85-
// Tour should reset after clearing local storage
86-
await browser.clearLocalStorage();
87-
await browser.refresh();
88-
89-
await waitUntilFinishedLoading();
90-
expect(await isTourStepOpen('shellTourStep')).to.be(true);
91100
});
92101

93102
it('skipping the tour hides the tour steps', async () => {
94103
await waitUntilFinishedLoading();
95104

105+
// Run tour
106+
await runConsoleTour();
107+
96108
expect(await isTourStepOpen('shellTourStep')).to.be(true);
97109
expect(await testSubjects.exists('consoleSkipTourButton')).to.be(true);
98110
await PageObjects.console.clickSkipTour();
99111

100112
// All steps should now be hidden
101113
await expectAllStepsHidden();
102-
103-
// Tour should not show after refreshing the browser
104-
await browser.refresh();
105-
await expectAllStepsHidden();
106114
});
107115

108116
it('allows re-running the tour', async () => {
109117
await waitUntilFinishedLoading();
110118

119+
// Run tour
120+
await runConsoleTour();
121+
122+
// Verify that first tour step is visible
123+
expect(await isTourStepOpen('shellTourStep')).to.be(true);
124+
125+
// Skip ongoing tour
111126
await PageObjects.console.skipTourIfExists();
112127

113128
// Verify that tour is hiddern
114129
await expectAllStepsHidden();
115130

116131
// Re-run tour
117-
await PageObjects.console.clickHelpIcon();
118-
await PageObjects.console.clickRerunTour();
132+
await runConsoleTour();
119133

120-
// Verify that first tour step is visible
121-
await waitUntilFinishedLoading();
134+
// Verify again that first tour step is visible
122135
expect(await isTourStepOpen('shellTourStep')).to.be(true);
123136
});
124137
});

src/platform/test/functional/page_objects/console_page.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -311,8 +311,8 @@ export class ConsolePageObject extends FtrService {
311311
await this.testSubjects.click('consoleCompleteTourButton');
312312
}
313313

314-
public async clickRerunTour() {
315-
await this.testSubjects.click('consoleRerunTourButton');
314+
public async clickRunTour() {
315+
await this.testSubjects.click('consoleRunTourButton');
316316
}
317317

318318
public async openConsole() {

x-pack/platform/plugins/private/translations/translations/fr-FR.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -429,8 +429,6 @@
429429
"console.helpPopover.aboutQueryDSLButtonAriaLabel": "À propos du lien QueryDSL",
430430
"console.helpPopover.aboutQueryDSLLabel": "À propos de Query DSL",
431431
"console.helpPopover.description": "La console est une interface utilisateur interactive qui vous permet d'appeler les API Elasticsearch et Kibana et d'afficher leurs réponses. Avec la syntaxe Query DSL et REST API, recherchez vos données, gérez les paramètres et bien plus encore.",
432-
"console.helpPopover.rerunTourButtonAriaLabel": "Bouton de réexécution de la présentation des fonctionnalités",
433-
"console.helpPopover.rerunTourLabel": "Réexécution de la présentation des fonctionnalités",
434432
"console.helpPopover.title": "Console Elastic",
435433
"console.historyPage.addAndRunButtonLabel": "Ajouter et exécuter",
436434
"console.historyPage.applyHistoryButtonLabel": "Ajouter",

x-pack/platform/plugins/private/translations/translations/ja-JP.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -431,8 +431,6 @@
431431
"console.helpPopover.aboutQueryDSLButtonAriaLabel": "QueryDSLリンクについて",
432432
"console.helpPopover.aboutQueryDSLLabel": "Query DSLについて",
433433
"console.helpPopover.description": "Consoleは、ElasticsearchとKibanaのAPIを呼び出し、その応答を表示するためのインタラクティブなUIです。Query DSLとREST API構文を使用して、データの検索、設定の管理などを行います。",
434-
"console.helpPopover.rerunTourButtonAriaLabel": "機能ガイドを再実行ボタン",
435-
"console.helpPopover.rerunTourLabel": "機能ガイドを再実行",
436434
"console.helpPopover.title": "Elastic Console",
437435
"console.historyPage.addAndRunButtonLabel": "追加して実行",
438436
"console.historyPage.applyHistoryButtonLabel": "追加",

x-pack/platform/plugins/private/translations/translations/zh-CN.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -431,8 +431,6 @@
431431
"console.helpPopover.aboutQueryDSLButtonAriaLabel": "“关于查询 DSL”链接",
432432
"console.helpPopover.aboutQueryDSLLabel": "关于查询 DSL",
433433
"console.helpPopover.description": "Console 是一个用于调用 Elasticsearch 和 Kibana API 并查看其响应的交互式 UI。使用查询 DSL 和 REST API 语法搜索您的数据、管理设置等。",
434-
"console.helpPopover.rerunTourButtonAriaLabel": "重新运行功能教程按钮",
435-
"console.helpPopover.rerunTourLabel": "重新运行功能教程",
436434
"console.helpPopover.title": "Elastic Console",
437435
"console.historyPage.addAndRunButtonLabel": "添加并运行",
438436
"console.historyPage.applyHistoryButtonLabel": "添加",

x-pack/solutions/search/test/functional_search/tests/solution_navigation.ts

Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export default function searchSolutionNavigation({
1212
getPageObjects,
1313
getService,
1414
}: FtrProviderContext) {
15-
const { common, solutionNavigation, console } = getPageObjects([
15+
const { common, solutionNavigation } = getPageObjects([
1616
'common',
1717
'solutionNavigation',
1818
'console',
@@ -75,7 +75,6 @@ export default function searchSolutionNavigation({
7575
deepLinkId: AppDeepLinkId;
7676
breadcrumbs: string[];
7777
pageTestSubject: string;
78-
extraChecks?: Array<() => Promise<void>>;
7978
}> = [
8079
{
8180
deepLinkId: 'discover',
@@ -121,15 +120,6 @@ export default function searchSolutionNavigation({
121120
deepLinkId: 'dev_tools',
122121
breadcrumbs: ['Dev Tools'],
123122
pageTestSubject: 'console',
124-
extraChecks: [
125-
async () => {
126-
if (await console.isTourPopoverOpen()) {
127-
// Skip the tour if it's open. This will prevent the tour popover from staying on the page
128-
// and blocking breadcrumbs for other tests.
129-
await console.clickSkipTour();
130-
}
131-
},
132-
],
133123
},
134124
];
135125

@@ -144,11 +134,6 @@ export default function searchSolutionNavigation({
144134
for (const breadcrumb of testCase.breadcrumbs) {
145135
await solutionNavigation.breadcrumbs.expectBreadcrumbExists({ text: breadcrumb });
146136
}
147-
if (testCase.extraChecks !== undefined) {
148-
for (const check of testCase.extraChecks) {
149-
await check();
150-
}
151-
}
152137
}
153138

154139
await expectNoPageReload();

x-pack/test_serverless/functional/test_suites/search/navigation.ts

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,6 @@ export default function ({ getPageObject, getService }: FtrProviderContext) {
1818
const svlCommonNavigation = getPageObject('svlCommonNavigation');
1919
const svlCommonPage = getPageObject('svlCommonPage');
2020
const solutionNavigation = getPageObject('solutionNavigation');
21-
const console = getPageObject('console');
2221
const testSubjects = getService('testSubjects');
2322
const browser = getService('browser');
2423
const header = getPageObject('header');
@@ -54,7 +53,6 @@ export default function ({ getPageObject, getService }: FtrProviderContext) {
5453
deepLinkId: AppDeepLinkId;
5554
breadcrumbs: string[];
5655
pageTestSubject: string;
57-
extraCheck?: () => Promise<void>;
5856
}> = [
5957
{
6058
deepLinkId: 'searchHomepage',
@@ -105,13 +103,6 @@ export default function ({ getPageObject, getService }: FtrProviderContext) {
105103
deepLinkId: 'dev_tools:console',
106104
breadcrumbs: ['Developer Tools'],
107105
pageTestSubject: 'console',
108-
extraCheck: async () => {
109-
if (await console.isTourPopoverOpen()) {
110-
// Skip the tour if it's open. This will prevent the tour popover from staying on the page
111-
// and blocking breadcrumbs for other tests.
112-
await console.clickSkipTour();
113-
}
114-
},
115106
},
116107
];
117108

@@ -126,9 +117,6 @@ export default function ({ getPageObject, getService }: FtrProviderContext) {
126117
await solutionNavigation.breadcrumbs.expectBreadcrumbExists({ text: breadcrumb });
127118
}
128119
await testSubjects.existOrFail(testCase.pageTestSubject);
129-
if (testCase.extraCheck !== undefined) {
130-
await testCase.extraCheck();
131-
}
132120
}
133121

134122
// Open Project Settings

0 commit comments

Comments
 (0)