Skip to content

Commit 5dc72f4

Browse files
test: add more tests for learn file service (#1592)
Co-authored-by: Sem Bauke <[email protected]>
1 parent 58473c8 commit 5dc72f4

File tree

4 files changed

+230
-6
lines changed

4 files changed

+230
-6
lines changed

mobile-app/lib/service/learn/learn_file_service.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -183,7 +183,7 @@ class LearnFileService {
183183
// It will parse the current CSS content into style tags only if it is linked.
184184
// If there is nothing to parse it will return the plain content document.
185185

186-
Future<String> parseCssDocmentsAsStyleTags(
186+
Future<String> parseCssDocumentsAsStyleTags(
187187
Challenge challenge,
188188
String content, {
189189
bool testing = false,
@@ -232,7 +232,7 @@ class LearnFileService {
232232
// It will parse the current JS content into script tags only if it is linked.
233233
// If there is nothing to parse it will return the plain content document.
234234

235-
Future<String> parseJsDocmentsAsScriptTags(
235+
Future<String> parseJsDocumentsAsScriptTags(
236236
Challenge challenge,
237237
String challengeContent,
238238
InAppWebViewController? babelController, {

mobile-app/lib/ui/views/learn/challenge/challenge_viewmodel.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -486,7 +486,7 @@ class ChallengeViewModel extends BaseViewModel {
486486

487487
// TODO: Remove check since we do it in function also
488488
if (cssFiles.isNotEmpty) {
489-
cssParsed = await fileService.parseCssDocmentsAsStyleTags(
489+
cssParsed = await fileService.parseCssDocumentsAsStyleTags(
490490
currChallenge,
491491
text,
492492
);
@@ -495,7 +495,7 @@ class ChallengeViewModel extends BaseViewModel {
495495
}
496496

497497
if (jsFiles.isNotEmpty) {
498-
jsParsed = await fileService.parseJsDocmentsAsScriptTags(
498+
jsParsed = await fileService.parseJsDocumentsAsScriptTags(
499499
currChallenge,
500500
cssParsed ?? text,
501501
_babelWebView.webViewController,

mobile-app/lib/ui/views/learn/test_runner.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -73,14 +73,14 @@ return testRes;
7373
return babelRes?.value ?? challengeFile;
7474
default:
7575
String parsedWithStyleTags =
76-
await fileService.parseCssDocmentsAsStyleTags(
76+
await fileService.parseCssDocumentsAsStyleTags(
7777
challenge,
7878
challengeFile,
7979
testing: testing,
8080
);
8181

8282
String parsedWithScriptTags =
83-
await fileService.parseJsDocmentsAsScriptTags(
83+
await fileService.parseJsDocumentsAsScriptTags(
8484
challenge,
8585
parsedWithStyleTags,
8686
babelController,

mobile-app/test/unit/learn_file_controller_test.dart

Lines changed: 224 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -141,4 +141,228 @@ void main() {
141141
expect(value, true);
142142
});
143143
});
144+
145+
group('jsFileIsLinked function', () {
146+
testWidgets(
147+
'it should return false if the JS file is not linked in the HTML document',
148+
(tester) async {
149+
String document = '''
150+
<html>
151+
<head></head>
152+
<body>
153+
<script src="different-script.js"></script>
154+
</body>
155+
</html>
156+
''';
157+
bool value = await service.jsFileIsLinked(document, 'script.js');
158+
expect(value, false);
159+
});
160+
161+
testWidgets(
162+
'it should return true if the JS file is linked in the HTML document',
163+
(tester) async {
164+
String document = '''
165+
<html>
166+
<head></head>
167+
<body>
168+
<script src="script.js"></script>
169+
</body>
170+
</html>
171+
''';
172+
bool value = await service.jsFileIsLinked(document, 'script.js');
173+
expect(value, true);
174+
});
175+
176+
testWidgets(
177+
'it should return true if the JS file is in a folder and is linked in the HTML document',
178+
(tester) async {
179+
String document = '''
180+
<html>
181+
<head></head>
182+
<body>
183+
<script src="./src/script.js"></script>
184+
</body>
185+
</html>
186+
''';
187+
bool value = await service.jsFileIsLinked(document, 'script.js');
188+
expect(value, true);
189+
});
190+
});
191+
192+
group('parseCssDocumentsAsStyleTags function', () {
193+
testWidgets('it should inject style tag if CSS file is linked',
194+
(tester) async {
195+
Challenge cssChallenge = Challenge(
196+
id: '2',
197+
block: 'css block',
198+
title: 'css-test',
199+
description: '',
200+
instructions: '',
201+
transcript: '',
202+
dashedName: 'css-test',
203+
superBlock: 'super block',
204+
challengeType: 1,
205+
helpCategory: HelpCategory.htmlCss,
206+
tests: [],
207+
hooks: Hooks(beforeAll: '', beforeEach: '', afterEach: ''),
208+
files: [
209+
ChallengeFile(
210+
ext: Ext.html,
211+
name: 'index',
212+
editableRegionBoundaries: [],
213+
contents:
214+
'''<html><head><link href="styles.css"></head><body></body></html>''',
215+
history: [],
216+
fileKey: 'index.html',
217+
),
218+
ChallengeFile(
219+
ext: Ext.css,
220+
name: 'styles',
221+
editableRegionBoundaries: [1, 5],
222+
contents: 'body { color: red; }',
223+
history: [],
224+
fileKey: 'styles.css',
225+
)
226+
],
227+
);
228+
String html = cssChallenge.files[0].contents;
229+
String result = await service
230+
.parseCssDocumentsAsStyleTags(cssChallenge, html, testing: true);
231+
expect(
232+
result,
233+
contains(
234+
'<style class="fcc-injected-styles"> body { color: red; } </style>'));
235+
});
236+
237+
testWidgets('it should not inject style tag if CSS file is not linked',
238+
(tester) async {
239+
Challenge cssChallenge = Challenge(
240+
id: '3',
241+
block: 'css block',
242+
title: 'css-test',
243+
description: '',
244+
instructions: '',
245+
transcript: '',
246+
dashedName: 'css-test',
247+
superBlock: 'super block',
248+
challengeType: 1,
249+
helpCategory: HelpCategory.htmlCss,
250+
tests: [],
251+
hooks: Hooks(beforeAll: '', beforeEach: '', afterEach: ''),
252+
files: [
253+
ChallengeFile(
254+
ext: Ext.html,
255+
name: 'index',
256+
editableRegionBoundaries: [],
257+
contents: '''<html><head></head><body></body></html>''',
258+
history: [],
259+
fileKey: 'index.html',
260+
),
261+
ChallengeFile(
262+
ext: Ext.css,
263+
name: 'styles',
264+
editableRegionBoundaries: [1, 5],
265+
contents: 'body { color: blue; }',
266+
history: [],
267+
fileKey: 'styles.css',
268+
)
269+
],
270+
);
271+
String html = cssChallenge.files[0].contents;
272+
String result = await service
273+
.parseCssDocumentsAsStyleTags(cssChallenge, html, testing: true);
274+
expect(result, isNot(contains('fcc-injected-styles')));
275+
});
276+
});
277+
278+
group('parseJsDocumentsAsScriptTags function', () {
279+
testWidgets(
280+
'it should inject script content if JS file is linked when babelController is null',
281+
(tester) async {
282+
Challenge jsChallenge = Challenge(
283+
id: '4',
284+
block: 'js block',
285+
title: 'js-test',
286+
description: '',
287+
instructions: '',
288+
transcript: '',
289+
dashedName: 'js-test',
290+
superBlock: 'super block',
291+
challengeType: 1,
292+
helpCategory: HelpCategory.htmlCss,
293+
tests: [],
294+
hooks: Hooks(beforeAll: '', beforeEach: '', afterEach: ''),
295+
files: [
296+
ChallengeFile(
297+
ext: Ext.html,
298+
name: 'index',
299+
editableRegionBoundaries: [],
300+
contents:
301+
'''<html><head></head><body><script src="script.js"></script></body></html>''',
302+
history: [],
303+
fileKey: 'index.html',
304+
),
305+
ChallengeFile(
306+
ext: Ext.js,
307+
name: 'script',
308+
editableRegionBoundaries: [1, 5],
309+
contents: 'console.log("hello");',
310+
history: [],
311+
fileKey: 'script.js',
312+
)
313+
],
314+
);
315+
String html = jsChallenge.files[0].contents;
316+
String result = await service
317+
.parseJsDocumentsAsScriptTags(jsChallenge, html, null, testing: true);
318+
expect(result, contains('console.log("hello");'));
319+
});
320+
});
321+
322+
group('changeActiveFileLinks function', () {
323+
test('it should replace href/src with data-href/data-src for known files',
324+
() {
325+
String html = '''
326+
<html>
327+
<head>
328+
<link href="styles.css">
329+
<script src="script.js"></script>
330+
</head>
331+
<body></body>
332+
</html>
333+
''';
334+
335+
const expectedHtml = '''
336+
<html>
337+
<head>
338+
<link data-href="styles.css">
339+
<script data-src="script.js"></script>
340+
</head>
341+
<body></body>
342+
</html>
343+
''';
344+
345+
String result = service.changeActiveFileLinks(html);
346+
String stripWhitespace(String s) => s.replaceAll(RegExp(r'\s+'), '');
347+
348+
expect(stripWhitespace(result), stripWhitespace(expectedHtml));
349+
});
350+
351+
test('it should not change unrelated links/scripts', () {
352+
String html = '''
353+
<html>
354+
<head>
355+
<link href="other.css">
356+
<script src="other.js"></script>
357+
</head>
358+
<body></body>
359+
</html>
360+
''';
361+
362+
String result = service.changeActiveFileLinks(html);
363+
String stripWhitespace(String s) => s.replaceAll(RegExp(r'\s+'), '');
364+
365+
expect(stripWhitespace(result), stripWhitespace(html));
366+
});
367+
});
144368
}

0 commit comments

Comments
 (0)