@@ -62,53 +62,53 @@ if (!isBuild) {
62
62
63
63
test ( 'should have expected initial state' , async ( ) => {
64
64
// initial state, both counters 0, both labels red
65
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '0' ) ;
66
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '0' ) ;
67
- expect ( await getText ( ` #hmr-test-1 .label` ) ) . toBe ( 'hmr-test' ) ;
68
- expect ( await getText ( ` #hmr-test-2 .label` ) ) . toBe ( 'hmr-test' ) ;
69
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
70
- expect ( await getColor ( ` #hmr-test-2 .label` ) ) . toBe ( 'red' ) ;
65
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '0' ) ;
66
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '0' ) ;
67
+ expect ( await getText ( ' #hmr-test-1 .label' ) ) . toBe ( 'hmr-test' ) ;
68
+ expect ( await getText ( ' #hmr-test-2 .label' ) ) . toBe ( 'hmr-test' ) ;
69
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
70
+ expect ( await getColor ( ' #hmr-test-2 .label' ) ) . toBe ( 'red' ) ;
71
71
} ) ;
72
72
73
73
test ( 'should have working increment button' , async ( ) => {
74
74
// increment counter of one instance to have local state to verify after hmr updates
75
- await ( await getEl ( ` #hmr-test-1 .increment` ) ) . click ( ) ;
75
+ await ( await getEl ( ' #hmr-test-1 .increment' ) ) . click ( ) ;
76
76
await sleep ( 50 ) ;
77
77
78
78
// counter1 = 1, counter2 = 0
79
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
80
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '0' ) ;
79
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
80
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '0' ) ;
81
81
} ) ;
82
82
83
83
test ( 'should apply css changes in HmrTest.svelte' , async ( ) => {
84
84
// update style, change label color from red to green
85
85
await updateHmrTest ( ( content ) => content . replace ( 'color: red' , 'color: green' ) ) ;
86
86
87
87
// counter state should remain
88
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
89
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '0' ) ;
88
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
89
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '0' ) ;
90
90
91
91
// color should have changed
92
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'green' ) ;
93
- expect ( await getColor ( ` #hmr-test-2 .label` ) ) . toBe ( 'green' ) ;
92
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'green' ) ;
93
+ expect ( await getColor ( ' #hmr-test-2 .label' ) ) . toBe ( 'green' ) ;
94
94
} ) ;
95
95
96
96
test ( 'should apply js change in HmrTest.svelte ' , async ( ) => {
97
97
// update script, change label value
98
98
await updateHmrTest ( ( content ) =>
99
99
content . replace ( "const label = 'hmr-test'" , "const label = 'hmr-test-updated'" )
100
100
) ;
101
- expect ( await getText ( ` #hmr-test-1 .label` ) ) . toBe ( 'hmr-test-updated' ) ;
102
- expect ( await getText ( ` #hmr-test-2 .label` ) ) . toBe ( 'hmr-test-updated' ) ;
101
+ expect ( await getText ( ' #hmr-test-1 .label' ) ) . toBe ( 'hmr-test-updated' ) ;
102
+ expect ( await getText ( ' #hmr-test-2 .label' ) ) . toBe ( 'hmr-test-updated' ) ;
103
103
} ) ;
104
104
105
105
test ( 'should keep state of external store intact on change of HmrTest.svelte' , async ( ) => {
106
106
// counter state should remain
107
107
await updateHmrTest ( ( content ) =>
108
108
content . replace ( '<!-- HMR-TEMPLATE-INJECT -->' , '<span/>\n<!-- HMR-TEMPLATE-INJECT -->' )
109
109
) ;
110
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
111
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '0' ) ;
110
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
111
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '0' ) ;
112
112
} ) ;
113
113
114
114
test ( 'should preserve state of external store used by HmrTest.svelte when editing App.svelte' , async ( ) => {
@@ -120,53 +120,53 @@ if (!isBuild) {
120
120
)
121
121
) ;
122
122
// counter state is preserved
123
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
124
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '0' ) ;
123
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
124
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '0' ) ;
125
125
// a third instance has been added
126
- expect ( await getText ( ` #hmr-test-3 .counter` ) ) . toBe ( '0' ) ;
126
+ expect ( await getText ( ' #hmr-test-3 .counter' ) ) . toBe ( '0' ) ;
127
127
} ) ;
128
128
129
129
test ( 'should preserve state of store when editing hmr-stores.js' , async ( ) => {
130
130
// change state
131
- await ( await getEl ( ` #hmr-test-2 .increment` ) ) . click ( ) ;
131
+ await ( await getEl ( ' #hmr-test-2 .increment' ) ) . click ( ) ;
132
132
await sleep ( 50 ) ;
133
133
// update store
134
134
await updateStore ( ( content ) => `${ content } \n/*trigger change*/\n` ) ;
135
135
// counter state is preserved
136
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
137
- expect ( await getText ( ` #hmr-test-2 .counter` ) ) . toBe ( '1' ) ;
136
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
137
+ expect ( await getText ( ' #hmr-test-2 .counter' ) ) . toBe ( '1' ) ;
138
138
// a third instance has been added
139
- expect ( await getText ( ` #hmr-test-3 .counter` ) ) . toBe ( '0' ) ;
139
+ expect ( await getText ( ' #hmr-test-3 .counter' ) ) . toBe ( '0' ) ;
140
140
} ) ;
141
141
142
142
test ( 'should work when editing script context="module"' , async ( ) => {
143
- expect ( await getText ( ` #hmr-with-context` ) ) . toContain ( 'x=0 y=1 slot=1' ) ;
144
- expect ( await getText ( ` #hmr-without-context` ) ) . toContain ( 'x=0 y=1 slot=' ) ;
143
+ expect ( await getText ( ' #hmr-with-context' ) ) . toContain ( 'x=0 y=1 slot=1' ) ;
144
+ expect ( await getText ( ' #hmr-without-context' ) ) . toContain ( 'x=0 y=1 slot=' ) ;
145
145
expect ( hmrCount ( 'UsingNamed.svelte' ) , 'updates for UsingNamed.svelte' ) . toBe ( 0 ) ;
146
146
expect ( hmrCount ( 'UsingDefault.svelte' ) , 'updates for UsingDefault.svelte' ) . toBe ( 0 ) ;
147
147
await updateModuleContext ( ( content ) => content . replace ( 'y = 1' , 'y = 2' ) ) ;
148
- expect ( await getText ( ` #hmr-with-context` ) ) . toContain ( 'x=0 y=2 slot=2' ) ;
149
- expect ( await getText ( ` #hmr-without-context` ) ) . toContain ( 'x=0 y=2 slot=' ) ;
148
+ expect ( await getText ( ' #hmr-with-context' ) ) . toContain ( 'x=0 y=2 slot=2' ) ;
149
+ expect ( await getText ( ' #hmr-without-context' ) ) . toContain ( 'x=0 y=2 slot=' ) ;
150
150
expect ( hmrCount ( 'UsingNamed.svelte' ) , 'updates for UsingNamed.svelte' ) . toBe ( 1 ) ;
151
151
expect ( hmrCount ( 'UsingDefault.svelte' ) , 'updates for UsingDefault.svelte' ) . toBe ( 0 ) ;
152
152
} ) ;
153
153
154
154
test ( 'should work with emitCss: false in vite config' , async ( ) => {
155
155
await editViteConfig ( ( c ) => c . replace ( 'svelte()' , 'svelte({emitCss:false})' ) ) ;
156
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '0' ) ;
157
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'green' ) ;
158
- await ( await getEl ( ` #hmr-test-1 .increment` ) ) . click ( ) ;
156
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '0' ) ;
157
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'green' ) ;
158
+ await ( await getEl ( ' #hmr-test-1 .increment' ) ) . click ( ) ;
159
159
await sleep ( 50 ) ;
160
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
160
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
161
161
await updateHmrTest ( ( content ) => content . replace ( 'color: green' , 'color: red' ) ) ;
162
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
163
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
162
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
163
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
164
164
} ) ;
165
165
166
166
test ( 'should work with emitCss: false in svelte config' , async ( ) => {
167
- addFile ( 'svelte.config.cjs' , ` module.exports={vitePlugin:{emitCss:false}}` ) ;
167
+ addFile ( 'svelte.config.cjs' , ' module.exports={vitePlugin:{emitCss:false}}' ) ;
168
168
await waitForServerRestartAndPageReload ( ) ;
169
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
169
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
170
170
removeFile ( 'svelte.config.cjs' ) ;
171
171
} ) ;
172
172
@@ -188,14 +188,14 @@ if (!isBuild) {
188
188
) ;
189
189
await waitForServerRestartAndPageReload ( ) ;
190
190
expect ( await getText ( '#preprocess-inject' ) ) . toBe ( 'Injected' ) ;
191
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '0' ) ;
192
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
193
- await ( await getEl ( ` #hmr-test-1 .increment` ) ) . click ( ) ;
191
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '0' ) ;
192
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
193
+ await ( await getEl ( ' #hmr-test-1 .increment' ) ) . click ( ) ;
194
194
await sleep ( 50 ) ;
195
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
195
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
196
196
await updateHmrTest ( ( content ) => content . replace ( 'color: red' , 'color: green' ) ) ;
197
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'green' ) ;
198
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
197
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'green' ) ;
198
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
199
199
await editFile ( 'svelte.config.cjs' , ( content ) =>
200
200
content
201
201
. replace ( 'preprocess-inject' , 'preprocess-inject-2' )
@@ -204,20 +204,20 @@ if (!isBuild) {
204
204
await waitForServerRestartAndPageReload ( ) ;
205
205
expect ( await getText ( '#preprocess-inject-2' ) ) . toBe ( 'Injected 2' ) ;
206
206
expect ( await getEl ( '#preprocess-inject' ) ) . toBe ( null ) ;
207
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'green' ) ;
208
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '0' ) ;
209
- await ( await getEl ( ` #hmr-test-1 .increment` ) ) . click ( ) ;
207
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'green' ) ;
208
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '0' ) ;
209
+ await ( await getEl ( ' #hmr-test-1 .increment' ) ) . click ( ) ;
210
210
await sleep ( 50 ) ;
211
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
211
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
212
212
await updateHmrTest ( ( content ) => content . replace ( 'color: green' , 'color: red' ) ) ;
213
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
214
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '1' ) ;
213
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
214
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '1' ) ;
215
215
await removeFile ( 'svelte.config.cjs' ) ;
216
216
await waitForServerRestartAndPageReload ( ) ;
217
217
expect ( await getEl ( '#preprocess-inject-2' ) ) . toBe ( null ) ;
218
218
expect ( await getEl ( '#preprocess-inject' ) ) . toBe ( null ) ;
219
- expect ( await getColor ( ` #hmr-test-1 .label` ) ) . toBe ( 'red' ) ;
220
- expect ( await getText ( ` #hmr-test-1 .counter` ) ) . toBe ( '0' ) ;
219
+ expect ( await getColor ( ' #hmr-test-1 .label' ) ) . toBe ( 'red' ) ;
220
+ expect ( await getText ( ' #hmr-test-1 .counter' ) ) . toBe ( '0' ) ;
221
221
} ) ;
222
222
} ) ;
223
223
}
0 commit comments