@@ -3,11 +3,6 @@ import { pressKey, startTimeline } from "@jspsych/test-utils";
3
3
4
4
import { initJsPsych , JsPsych } from "../../src" ;
5
5
6
- // progress bar lives in the container element
7
- const getContainer = ( jsPsych : JsPsych ) => {
8
- return jsPsych . getDisplayContainerElement ( ) ;
9
- }
10
-
11
6
describe ( "automatic progress bar" , ( ) => {
12
7
test ( "progress bar does not display by default" , async ( ) => {
13
8
const { jsPsych } = await startTimeline ( [
@@ -17,8 +12,8 @@ describe("automatic progress bar", () => {
17
12
} ,
18
13
] ) ;
19
14
20
- const displayContainer = getContainer ( jsPsych ) ;
21
- expect ( displayContainer . querySelector ( "#jspsych-progressbar-container" ) ) . toBeNull ( ) ;
15
+ expect ( jsPsych . getDisplayContainerElement ( ) . querySelector ( "#jspsych-progressbar-container" ) )
16
+ . toBeNull ( ) ;
22
17
await pressKey ( "a" ) ;
23
18
} ) ;
24
19
@@ -33,10 +28,10 @@ describe("automatic progress bar", () => {
33
28
{ show_progress_bar : true }
34
29
) ;
35
30
36
- const displayContainer = getContainer ( jsPsych ) ;
37
- expect ( displayContainer . querySelector ( "#jspsych-progressbar-container" ) . innerHTML ) . toMatch (
38
- '<span>Completion Progress</span><div id="jspsych-progressbar-outer"><div id="jspsych-progressbar-inner" style="width: 0%;"></div></div>'
39
- ) ;
31
+ expect ( jsPsych . getDisplayContainerElement ( ) . querySelector ( "#jspsych-progressbar-container" ) . innerHTML )
32
+ . toMatch (
33
+ '<span>Completion Progress</span><div id="jspsych-progressbar-outer"><div id="jspsych-progressbar-inner" style="width: 0%;"></div></div>'
34
+ ) ;
40
35
} ) ;
41
36
42
37
test ( "progress bar automatically updates by default" , async ( ) => {
@@ -50,8 +45,8 @@ describe("automatic progress bar", () => {
50
45
{ show_progress_bar : true }
51
46
) ;
52
47
53
- const displayContainer = getContainer ( jsPsych ) ;
54
- const progressbarElement = displayContainer . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
48
+ const progressbarElement =
49
+ jsPsych . getDisplayContainerElement ( ) . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
55
50
56
51
expect ( progressbarElement . style . width ) . toEqual ( "0%" ) ;
57
52
await pressKey ( "a" ) ;
@@ -75,8 +70,8 @@ describe("automatic progress bar", () => {
75
70
auto_update_progress_bar : false ,
76
71
} ) ;
77
72
78
- const displayContainer = getContainer ( jsPsych ) ;
79
- const progressbarElement = displayContainer . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
73
+ const progressbarElement =
74
+ jsPsych . getDisplayContainerElement ( ) . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
80
75
81
76
for ( let i = 0 ; i < 4 ; i ++ ) {
82
77
expect ( progressbarElement . style . width ) . toEqual ( "0%" ) ;
@@ -110,8 +105,8 @@ describe("automatic progress bar", () => {
110
105
111
106
const { jsPsych } = await startTimeline ( timeline , jsPsychObject ) ;
112
107
113
- const displayContainer = getContainer ( jsPsych ) ;
114
- const progressbarElement = displayContainer . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
108
+ const progressbarElement =
109
+ jsPsych . getDisplayContainerElement ( ) . querySelector < HTMLElement > ( "#jspsych-progressbar-inner" ) ;
115
110
116
111
expect ( progressbarElement . style . width ) . toEqual ( "0%" ) ;
117
112
await pressKey ( "a" ) ;
0 commit comments