Skip to content

Commit 14845f4

Browse files
committed
fixup! refactor remove globals from test
1 parent f4a65c8 commit 14845f4

File tree

2 files changed

+71
-65
lines changed

2 files changed

+71
-65
lines changed

src/browser/pages/vscode.ts

-2
Original file line numberDiff line numberDiff line change
@@ -217,8 +217,6 @@ export function setBodyBackgroundToThemeBackgroundColor(_document: Document, _lo
217217
* so that it's easier to test.
218218
*/
219219
export function main(_document: Document | undefined, _window: Window | undefined, _localStorage: Storage | undefined) {
220-
const errorMsgPrefix = "[vscode]"
221-
222220
if (!_document) {
223221
throw new Error(`document is undefined.`)
224222
}

test/unit/browser/pages/vscode.test.ts

+71-63
Original file line numberDiff line numberDiff line change
@@ -14,56 +14,54 @@ import {
1414

1515
describe("vscode", () => {
1616
describe("getNlsConfiguration", () => {
17-
beforeEach(() => {
18-
const { window } = new JSDOM()
19-
global.document = window.document
20-
})
17+
let _document: Document
2118

22-
afterEach(() => {
23-
global.window = undefined as unknown as Window & typeof globalThis
24-
global.document = undefined as unknown as Document & typeof globalThis
19+
beforeEach(() => {
20+
// We use underscores to not confuse with global values
21+
const { window: _window } = new JSDOM()
22+
_document = _window.document
2523
})
2624

2725
it("should throw an error if no nlsConfigElement", () => {
2826
const errorMsgPrefix = "[vscode]"
2927
const errorMessage = `${errorMsgPrefix} Could not parse NLS configuration. Could not find nlsConfigElement with id: ${nlsConfigElementId}`
3028

3129
expect(() => {
32-
getNlsConfiguration(document, "")
30+
getNlsConfiguration(_document, "")
3331
}).toThrowError(errorMessage)
3432
})
3533
it("should throw an error if no nlsConfig", () => {
36-
const mockElement = document.createElement("div")
34+
const mockElement = _document.createElement("div")
3735
mockElement.setAttribute("id", nlsConfigElementId)
38-
document.body.appendChild(mockElement)
36+
_document.body.appendChild(mockElement)
3937

4038
const errorMsgPrefix = "[vscode]"
4139
const errorMessage = `${errorMsgPrefix} Could not parse NLS configuration. Found nlsConfigElement but missing data-settings attribute.`
4240

4341
expect(() => {
44-
getNlsConfiguration(document, "")
42+
getNlsConfiguration(_document, "")
4543
}).toThrowError(errorMessage)
4644

47-
document.body.removeChild(mockElement)
45+
_document.body.removeChild(mockElement)
4846
})
4947
it("should return the correct configuration", () => {
50-
const mockElement = document.createElement("div")
48+
const mockElement = _document.createElement("div")
5149
const dataSettings = {
5250
first: "Jane",
5351
last: "Doe",
5452
}
5553

5654
mockElement.setAttribute("id", nlsConfigElementId)
5755
mockElement.setAttribute("data-settings", JSON.stringify(dataSettings))
58-
document.body.appendChild(mockElement)
59-
const actual = getNlsConfiguration(global.document, "")
56+
_document.body.appendChild(mockElement)
57+
const actual = getNlsConfiguration(_document, "")
6058

6159
expect(actual).toStrictEqual(dataSettings)
6260

63-
document.body.removeChild(mockElement)
61+
_document.body.removeChild(mockElement)
6462
})
6563
it("should return have loadBundle property if _resolvedLangaugePackCoreLocation", () => {
66-
const mockElement = document.createElement("div")
64+
const mockElement = _document.createElement("div")
6765
const dataSettings = {
6866
locale: "en",
6967
availableLanguages: ["en", "de"],
@@ -72,13 +70,13 @@ describe("vscode", () => {
7270

7371
mockElement.setAttribute("id", nlsConfigElementId)
7472
mockElement.setAttribute("data-settings", JSON.stringify(dataSettings))
75-
document.body.appendChild(mockElement)
76-
const nlsConfig = getNlsConfiguration(global.document, "")
73+
_document.body.appendChild(mockElement)
74+
const nlsConfig = getNlsConfiguration(_document, "")
7775

7876
expect(nlsConfig._resolvedLanguagePackCoreLocation).not.toBe(undefined)
7977
expect(nlsConfig.loadBundle).not.toBe(undefined)
8078

81-
document.body.removeChild(mockElement)
79+
_document.body.removeChild(mockElement)
8280
})
8381
})
8482
describe("createBundlePath", () => {
@@ -91,45 +89,48 @@ describe("vscode", () => {
9189
})
9290
})
9391
describe("setBodyBackgroundToThemeBackgroundColor", () => {
92+
let _document: Document
93+
let _localStorage: Storage
94+
9495
beforeEach(() => {
9596
// We need to set the url in the JSDOM constructor
9697
// to prevent this error "SecurityError: localStorage is not available for opaque origins"
9798
// See: https://github.com/jsdom/jsdom/issues/2304#issuecomment-622314949
98-
const { window } = new JSDOM("", { url: "http://localhost" })
99-
global.document = window.document
100-
global.localStorage = window.localStorage
99+
const { window: _window } = new JSDOM("", { url: "http://localhost" })
100+
_document = _window.document
101+
_localStorage = _window.localStorage
101102
})
102103
it("should return null", () => {
103104
const test = {
104105
colorMap: {
105106
[`editor.background`]: "#ff3270",
106107
},
107108
}
108-
localStorage.setItem("colorThemeData", JSON.stringify(test))
109+
_localStorage.setItem("colorThemeData", JSON.stringify(test))
109110

110-
expect(setBodyBackgroundToThemeBackgroundColor(document, localStorage)).toBeNull()
111+
expect(setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)).toBeNull()
111112

112-
localStorage.removeItem("colorThemeData")
113+
_localStorage.removeItem("colorThemeData")
113114
})
114115
it("should throw an error if it can't find colorThemeData in localStorage", () => {
115116
const errorMsgPrefix = "[vscode]"
116117
const errorMessage = `${errorMsgPrefix} Could not set body background to theme background color. Could not find colorThemeData in localStorage.`
117118

118119
expect(() => {
119-
setBodyBackgroundToThemeBackgroundColor(document, localStorage)
120+
setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)
120121
}).toThrowError(errorMessage)
121122
})
122123
it("should throw an error if there is an error parsing colorThemeData from localStorage", () => {
123124
const errorMsgPrefix = "[vscode]"
124125
const errorMessage = `${errorMsgPrefix} Could not set body background to theme background color. Could not parse colorThemeData from localStorage.`
125126

126-
localStorage.setItem(
127+
_localStorage.setItem(
127128
"colorThemeData",
128129
'{"id":"vs-dark max-SS-Cyberpunk-themes-cyberpunk-umbra-color-theme-json","label":"Activate UMBRA protocol","settingsId":"Activate "errorForeground":"#ff3270","foreground":"#ffffff","sideBarTitle.foreground":"#bbbbbb"},"watch\\":::false}',
129130
)
130131

131132
expect(() => {
132-
setBodyBackgroundToThemeBackgroundColor(document, localStorage)
133+
setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)
133134
}).toThrowError(errorMessage)
134135

135136
localStorage.removeItem("colorThemeData")
@@ -141,13 +142,13 @@ describe("vscode", () => {
141142
const test = {
142143
id: "hey-joe",
143144
}
144-
localStorage.setItem("colorThemeData", JSON.stringify(test))
145+
_localStorage.setItem("colorThemeData", JSON.stringify(test))
145146

146147
expect(() => {
147-
setBodyBackgroundToThemeBackgroundColor(document, localStorage)
148+
setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)
148149
}).toThrowError(errorMessage)
149150

150-
localStorage.removeItem("colorThemeData")
151+
_localStorage.removeItem("colorThemeData")
151152
})
152153
it("should throw an error if there is no editor.background color", () => {
153154
const errorMsgPrefix = "[vscode]"
@@ -159,44 +160,44 @@ describe("vscode", () => {
159160
editor: "#fff",
160161
},
161162
}
162-
localStorage.setItem("colorThemeData", JSON.stringify(test))
163+
_localStorage.setItem("colorThemeData", JSON.stringify(test))
163164

164165
expect(() => {
165-
setBodyBackgroundToThemeBackgroundColor(document, localStorage)
166+
setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)
166167
}).toThrowError(errorMessage)
167168

168-
localStorage.removeItem("colorThemeData")
169+
_localStorage.removeItem("colorThemeData")
169170
})
170171
it("should set the body background to the editor background color", () => {
171172
const test = {
172173
colorMap: {
173174
[`editor.background`]: "#ff3270",
174175
},
175176
}
176-
localStorage.setItem("colorThemeData", JSON.stringify(test))
177+
_localStorage.setItem("colorThemeData", JSON.stringify(test))
177178

178-
setBodyBackgroundToThemeBackgroundColor(document, localStorage)
179+
setBodyBackgroundToThemeBackgroundColor(_document, _localStorage)
179180

180181
// When the body.style.backgroundColor is set using hex
181182
// it is converted to rgb
182183
// which is why we use that in the assertion
183-
expect(document.body.style.backgroundColor).toBe("rgb(255, 50, 112)")
184+
expect(_document.body.style.backgroundColor).toBe("rgb(255, 50, 112)")
184185

185-
localStorage.removeItem("colorThemeData")
186+
_localStorage.removeItem("colorThemeData")
186187
})
187188
})
188189
describe("getConfigurationForLoader", () => {
190+
let _window: Window
191+
189192
beforeEach(() => {
190-
const { window } = new JSDOM()
191-
global.document = window.document
192-
})
193-
afterEach(() => {
194-
global.window = undefined as unknown as Window & typeof globalThis
195-
global.document = undefined as unknown as Document & typeof globalThis
193+
const { window: __window } = new JSDOM()
194+
// @ts-expect-error the Window from JSDOM is not exactly the same as Window
195+
// so we expect an error here
196+
_window = __window
196197
})
197198
it("should return a loader object (with undefined trustedTypesPolicy)", () => {
198199
const options = {
199-
base: "/",
200+
base: ".",
200201
csStaticBase: "/",
201202
logLevel: 1,
202203
}
@@ -208,12 +209,12 @@ describe("vscode", () => {
208209
}
209210
const loader = getConfigurationForLoader({
210211
options,
212+
_window,
211213
nlsConfig: nlsConfig,
212-
_window: global.window,
213214
})
214215

215216
expect(loader).toStrictEqual({
216-
baseUrl: "localhost//lib/vscode/out",
217+
baseUrl: "http://localhost//lib/vscode/out",
217218
paths: {
218219
"iconv-lite-umd": "../node_modules/iconv-lite-umd/lib/iconv-lite-umd.js",
219220
jschardet: "../node_modules/jschardet/dist/jschardet.min.js",
@@ -256,7 +257,7 @@ describe("vscode", () => {
256257
const mockFn = jest.fn(mockCreatePolicy)
257258

258259
// @ts-expect-error we are adding a custom property to window
259-
global.window.trustedTypes = {
260+
_window.trustedTypes = {
260261
createPolicy: mockFn,
261262
}
262263

@@ -273,8 +274,8 @@ describe("vscode", () => {
273274
}
274275
const loader = getConfigurationForLoader({
275276
options,
277+
_window,
276278
nlsConfig: nlsConfig,
277-
_window: global.window,
278279
})
279280

280281
expect(loader.trustedTypesPolicy).not.toBe(undefined)
@@ -294,59 +295,66 @@ describe("vscode", () => {
294295
})
295296
})
296297
describe("main", () => {
298+
let _window: Window
299+
let _document: Document
300+
let _localStorage: Storage
301+
297302
beforeEach(() => {
298303
// We need to set the url in the JSDOM constructor
299304
// to prevent this error "SecurityError: localStorage is not available for opaque origins"
300305
// See: https://github.com/jsdom/jsdom/issues/2304#issuecomment-62231494
301-
const { window } = new JSDOM("", { url: "http://localhost" })
302-
global.document = window.document
303-
global.localStorage = window.localStorage
304-
305-
const mockElement = document.createElement("div")
306+
const { window: __window } = new JSDOM("", { url: "http://localhost" })
307+
// @ts-expect-error the Window from JSDOM is not exactly the same as Window
308+
// so we expect an error here
309+
_window = __window
310+
_document = __window.document
311+
_localStorage = __window.localStorage
312+
313+
const mockElement = _document.createElement("div")
306314
const dataSettings = {
307315
first: "Jane",
308316
last: "Doe",
309317
}
310318

311319
mockElement.setAttribute("id", nlsConfigElementId)
312320
mockElement.setAttribute("data-settings", JSON.stringify(dataSettings))
313-
document.body.appendChild(mockElement)
321+
_document.body.appendChild(mockElement)
314322

315323
const test = {
316324
colorMap: {
317325
[`editor.background`]: "#ff3270",
318326
},
319327
}
320-
localStorage.setItem("colorThemeData", JSON.stringify(test))
328+
_localStorage.setItem("colorThemeData", JSON.stringify(test))
321329
})
322330
afterEach(() => {
323-
localStorage.removeItem("colorThemeData")
331+
_localStorage.removeItem("colorThemeData")
324332
})
325333
it("should throw if document is missing", () => {
326334
expect(() => {
327-
main(undefined, window, localStorage)
335+
main(undefined, _window, _localStorage)
328336
}).toThrow("document is undefined.")
329337
})
330338
it("should throw if window is missing", () => {
331339
expect(() => {
332-
main(document, undefined, localStorage)
340+
main(_document, undefined, _localStorage)
333341
}).toThrow("window is undefined.")
334342
})
335343
it("should throw if localStorage is missing", () => {
336344
expect(() => {
337-
main(document, window, undefined)
345+
main(_document, _window, undefined)
338346
}).toThrow("localStorage is undefined.")
339347
})
340348
it("should add loader to self.require", () => {
341-
main(document, window, localStorage)
349+
main(_document, _window, _localStorage)
342350

343351
expect(Object.prototype.hasOwnProperty.call(self, "require")).toBe(true)
344352
})
345353
it("should not throw in browser context", () => {
346354
// Assuming we call it in a normal browser context
347355
// where everything is defined
348356
expect(() => {
349-
main(global.document, global.window, global.localStorage)
357+
main(_document, _window, _localStorage)
350358
}).not.toThrow()
351359
})
352360
})

0 commit comments

Comments
 (0)