File tree Expand file tree Collapse file tree 2 files changed +25
-2
lines changed
packages/calcite-components/src/components/flow Expand file tree Collapse file tree 2 files changed +25
-2
lines changed Original file line number Diff line number Diff line change @@ -4,6 +4,7 @@ import { html } from "../../../support/formatting";
4
4
import { accessible , focusable , hidden , renders } from "../../tests/commonTests" ;
5
5
import { CSS as ITEM_CSS } from "../flow-item/resources" ;
6
6
import { CSS } from "./resources" ;
7
+ import { isElementFocused } from "../../tests/utils" ;
7
8
8
9
describe ( "calcite-flow" , ( ) => {
9
10
describe ( "renders" , ( ) => {
@@ -55,6 +56,27 @@ describe("calcite-flow", () => {
55
56
expect ( flowItem ) . toBeNull ( ) ;
56
57
} ) ;
57
58
59
+ it ( "should call setFocus() on back button click" , async ( ) => {
60
+ const page = await newE2EPage ( ) ;
61
+
62
+ await page . setContent (
63
+ html `< calcite-flow
64
+ > < calcite-flow-item id ="one "> </ calcite-flow-item > < calcite-flow-item id ="two "> </ calcite-flow-item
65
+ > </ calcite-flow > `
66
+ ) ;
67
+
68
+ await page . $eval (
69
+ "#two" ,
70
+ ( elm : HTMLCalciteFlowItemElement , backButtonCSS : string ) => {
71
+ elm . shadowRoot . querySelector < HTMLCalciteActionElement > ( `.${ backButtonCSS } ` ) ?. click ( ) ;
72
+ } ,
73
+ ITEM_CSS . backButton
74
+ ) ;
75
+ await page . waitForChanges ( ) ;
76
+
77
+ await isElementFocused ( page , "#one" ) ;
78
+ } ) ;
79
+
58
80
it ( "goes back when item back button is clicked" , async ( ) => {
59
81
const page = await newE2EPage ( ) ;
60
82
Original file line number Diff line number Diff line change @@ -107,8 +107,9 @@ export class Flow implements LoadableComponent {
107
107
// --------------------------------------------------------------------------
108
108
109
109
@Listen ( "calciteFlowItemBack" )
110
- handleItemBackClick ( ) : void {
111
- this . back ( ) ;
110
+ async handleItemBackClick ( ) : Promise < void > {
111
+ await this . back ( ) ;
112
+ return this . setFocus ( ) ;
112
113
}
113
114
114
115
getFlowDirection = ( oldFlowItemCount : number , newFlowItemCount : number ) : FlowDirection | null => {
You can’t perform that action at this time.
0 commit comments