test(dev-server): tests for appending dev server connect

ionic-team · Dec 20, 2019 · a38d76c · a38d76c
1 parent 140fc7f
commit a38d76c
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 7 deletions.
diff --git a/src/dev-server/serve-file.ts b/src/dev-server/serve-file.ts
@@ -120,11 +120,16 @@ const urlVersionIds = new Map<string, string>();
 function appendDevServerClientScript(devServerConfig: d.DevServerConfig, req: d.HttpRequest, content: string) {
   const devServerClientUrl = util.getDevServerClientUrl(devServerConfig, req.host);
   const iframe = `<iframe title="Stencil Dev Server Connector ${compilerBuild.stencilVersion} &#9889;" src="${devServerClientUrl}" style="display:block;width:0;height:0;border:0" aria-hidden="true"></iframe>`;
+  return appendDevServerClientIframe(content, iframe);
+}
+
+
+export function appendDevServerClientIframe(content: string, iframe: string) {
   if (content.includes('</body>')) {
-    return content.replace('</body>', `${iframe}\n</body>`);
+    return content.replace('</body>', `${iframe}</body>`);
   }
   if (content.includes('</html>')) {
-    return content.replace('</html>', `${iframe}\n</html>`);
+    return content.replace('</html>', `${iframe}</html>`);
   }
-  return `\n${content}`;
+  return `${content}${iframe}`;
 }
diff --git a/src/dev-server/test/req-handler.spec.ts b/src/dev-server/test/req-handler.spec.ts
@@ -1,4 +1,5 @@
 import * as d from '@stencil/core/declarations';
+import { appendDevServerClientIframe } from '../serve-file';
 import { createRequestHandler } from '../request-handler';
 import { createSystem } from '../../compiler_next/sys/stencil-sys';
 import { mockConfig } from '@stencil/core/testing';
@@ -354,31 +355,50 @@ describe('request-handler', () => {
   describe('serve static text files', () => {
 
     it('should load file w/ querystring', async () => {
-      await sys.writeFile(path.join(root, 'www', 'scripts', 'file1.html'), `<html></html>`);
+      await sys.writeFile(path.join(root, 'www', 'scripts', 'file1.html'), `html`);
       const handler = createRequestHandler(config, sys);
 
       req.url = '/scripts/file1.html?qs=1234';
 
       await handler(req, res);
       expect(res.$statusCode).toBe(200);
-      expect(res.$content).toContain('<html></html>');
+      expect(res.$content.split('\n')[0]).toContain('html');
       expect(res.$contentType).toBe('text/html');
     });
 
     it('should load html file', async () => {
-      await sys.writeFile(path.join(root, 'www', 'scripts', 'file1.html'), `<html></html>`);
+      await sys.writeFile(path.join(root, 'www', 'scripts', 'file1.html'), `html`);
       const handler = createRequestHandler(config, sys);
 
       req.url = '/scripts/file1.html';
 
       await handler(req, res);
       expect(res.$statusCode).toBe(200);
-      expect(res.$content).toContain('<html></html>');
+      expect(res.$content.split('\n')[0]).toContain('html');
       expect(res.$contentType).toBe('text/html');
     });
 
   });
 
+  describe('iframe connector', () => {
+
+    it('appends to <body>', () => {
+      const h = appendDevServerClientIframe(`<html><body>88mph</body></html>`, `<iframe></iframe>`);
+      expect(h).toBe(`<html><body>88mph<iframe></iframe></body></html>`);
+    });
+
+    it('appends to <html>', () => {
+      const h = appendDevServerClientIframe(`<html>88mph</html>`, `<iframe></iframe>`);
+      expect(h).toBe(`<html>88mph<iframe></iframe></html>`);
+    });
+
+    it('appends to end', () => {
+      const h = appendDevServerClientIframe(`88mph`, `<iframe></iframe>`);
+      expect(h).toBe(`88mph<iframe></iframe>`);
+    });
+
+  });
+
 });