template.spec.js 12KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. var path_1 = require("path");
  4. var mockFs = require("mock-fs");
  5. var logger_1 = require("./logger/logger");
  6. var template_1 = require("./template");
  7. var template_2 = require("./template");
  8. describe('template', function () {
  9. describe('inlineTemplate', function () {
  10. it('should inline multiple external html files which are the same for multiple @Components in same .ts file', function () {
  11. var sourceText = '/*someprefix*/@Component({templateUrl: "some-file.html" });/*somebetween*/@Component({templateUrl: "some-file.html" })/*somesuffix*/';
  12. var baseDir = path_1.join(process.cwd(), 'path', 'to', 'dir');
  13. var d = {};
  14. d[baseDir] = {
  15. 'some-file.html': '<div>A</div>',
  16. 'some-file.scss': 'body { color: red; }',
  17. 'some-file.ts': sourceText,
  18. };
  19. mockFs(d);
  20. var results = template_1.inlineTemplate(sourceText, path_1.join(baseDir, 'some-file.ts'));
  21. expect(results).toEqual("/*someprefix*/@Component({template:/*ion-inline-start:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/'<div>A</div>'/*ion-inline-end:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/ });/*somebetween*/@Component({template:/*ion-inline-start:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/'<div>A</div>'/*ion-inline-end:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/ })/*somesuffix*/");
  22. mockFs.restore();
  23. });
  24. it('should inline multiple external html files with multiple @Components in same .ts file', function () {
  25. var sourceText = '/*someprefix*/@Component({templateUrl: "some-file1.html" });/*somebetween*/@Component({templateUrl: "some-file2.html" })/*somesuffix*/';
  26. var baseDir = path_1.join(process.cwd(), 'path', 'to', 'dir');
  27. var d = {};
  28. d[baseDir] = {
  29. 'some-file1.html': '<div>A</div>',
  30. 'some-file2.html': '<div>B</div>',
  31. 'some-file.scss': 'body { color: red; }',
  32. 'some-file.ts': sourceText,
  33. };
  34. mockFs(d);
  35. var results = template_1.inlineTemplate(sourceText, path_1.join(baseDir, 'some-file.ts'));
  36. expect(results).toEqual("/*someprefix*/@Component({template:/*ion-inline-start:\"" + path_1.join(baseDir, 'some-file1.html') + "\"*/'<div>A</div>'/*ion-inline-end:\"" + path_1.join(baseDir, 'some-file1.html') + "\"*/ });/*somebetween*/@Component({template:/*ion-inline-start:\"" + path_1.join(baseDir, 'some-file2.html') + "\"*/'<div>B</div>'/*ion-inline-end:\"" + path_1.join(baseDir, 'some-file2.html') + "\"*/ })/*somesuffix*/");
  37. mockFs.restore();
  38. });
  39. it('should inline the external html file content', function () {
  40. var sourceText = '@Component({templateUrl: "some-file.html" })';
  41. var baseDir = path_1.join(process.cwd(), 'path', 'to', 'dir');
  42. var d = {};
  43. d[baseDir] = {
  44. 'some-file.html': '<div>hello</div>',
  45. 'some-file.scss': 'body { color: red; }',
  46. 'some-file.ts': sourceText,
  47. };
  48. mockFs(d);
  49. var results = template_1.inlineTemplate(sourceText, path_1.join(baseDir, 'some-file.ts'));
  50. expect(results).toEqual("@Component({template:/*ion-inline-start:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/'<div>hello</div>'/*ion-inline-end:\"" + path_1.join(baseDir, 'some-file.html') + "\"*/ })");
  51. mockFs.restore();
  52. });
  53. it('should do nothing for files with incomplete Component', function () {
  54. var sourceText = "\n // Component this be bork\n ";
  55. var sourcePath = 'somefile.ts';
  56. var output = template_1.inlineTemplate(sourceText, sourcePath);
  57. expect(output).toEqual(sourceText);
  58. });
  59. it('should do nothing for files without Component', function () {
  60. var sourceText = "\n console.log('yeah nothing');\n ";
  61. var sourcePath = 'somefile.ts';
  62. var output = template_1.inlineTemplate(sourceText, sourcePath);
  63. expect(output).toEqual(sourceText);
  64. });
  65. });
  66. describe('updateTemplate', function () {
  67. it('should load and replace html file content', function () {
  68. var d = {
  69. 'path/to/dir': {
  70. 'some-file.html': '<div>hello</div>',
  71. 'some-file.scss': 'body { color: red; }',
  72. 'some-file.ts': '@Component({templateUrl: "some-file.html" })',
  73. },
  74. };
  75. mockFs(d);
  76. var match = template_2.getTemplateMatch(d['path/to/dir']['some-file.ts']);
  77. var expected = template_1.replaceTemplateUrl(match, 'path/to/dir/some-file.html', '<div>hello</div>');
  78. var results = template_1.updateTemplate('path/to/dir', match);
  79. expect(results).toEqual(expected);
  80. mockFs.restore();
  81. });
  82. it('should load null for unfound html file content', function () {
  83. var d = {
  84. 'path/to/dir': {
  85. 'some-file.html': '<div>hello</div>',
  86. 'some-file.scss': 'body { color: red; }',
  87. 'some-file.ts': '@Component({templateUrl: "some-file-doesnt-exist.html" })',
  88. },
  89. };
  90. mockFs(d);
  91. var match = template_2.getTemplateMatch(d['path/to/dir']['some-file.ts']);
  92. var results = template_1.updateTemplate('path/to/dir', match);
  93. expect(results).toEqual(null);
  94. mockFs.restore();
  95. });
  96. });
  97. describe('replaceTemplateUrl', function () {
  98. it('should turn the template into one line', function () {
  99. var str = "\n Component({\n templateUrl: \"somepage.html\"})";
  100. var templateContent = "\n <div>\t\n this is \"multiline\" 'content'\n </div>\r\n ";
  101. var htmlFilePath = path_1.join(process.cwd(), 'full', 'path', 'to', 'somepage.html');
  102. var match = template_2.getTemplateMatch(str);
  103. var result = template_1.replaceTemplateUrl(match, htmlFilePath, templateContent);
  104. var expected = "Component({template:/*ion-inline-start:\"" + path_1.join(process.cwd(), 'full', 'path', 'to', 'somepage.html') + "\"*/'\\n <div>\t\\n this is \"multiline\" \\'content\\'\\n </div>\\n\\n '/*ion-inline-end:\"" + path_1.join(process.cwd(), 'full', 'path', 'to', 'somepage.html') + "\"*/})";
  105. expect(result).toEqual(expected);
  106. });
  107. });
  108. describe('getTemplateFormat', function () {
  109. it('should resolve the path', function () {
  110. var path = 'some/crazy/path/my.html';
  111. var resolvedPath = path_1.resolve(path);
  112. var results = template_2.getTemplateFormat(path, 'filibuster');
  113. expect(path).not.toEqual(resolvedPath);
  114. expect(results).toEqual("template:/*ion-inline-start:\"" + resolvedPath + "\"*/'filibuster'/*ion-inline-end:\"" + resolvedPath + "\"*/");
  115. });
  116. });
  117. describe('replaceBundleJsTemplate', function () {
  118. it('should replace already inlined template with new content', function () {
  119. var htmlFilePath = 'c:\\path/to\some/crazy:thing.html;';
  120. var oldContent = 'some old content';
  121. var tmplate = template_2.getTemplateFormat(htmlFilePath, oldContent);
  122. var bundleSourceText = "\n @Component({\n selector: 'yo-div',\n /*blah*/" + tmplate + "/*derp*/\n })\n @Component({\n selector: 'yo-div2',\n /*222*/" + tmplate + "/*2222*/\n })\n ";
  123. var newContent = 'some new content';
  124. var output = template_2.replaceExistingJsTemplate(bundleSourceText, newContent, htmlFilePath);
  125. expect(output.indexOf(newContent)).toBeGreaterThan(-1);
  126. expect(output.indexOf(newContent)).toBeGreaterThan(-1);
  127. });
  128. });
  129. describe('COMPONENT_REGEX match', function () {
  130. it('should get Component with template url and selector above', function () {
  131. var str = "\n Component({\n selector: 'page-home',\n templateUrl: 'home.html'\n })\n ";
  132. var match = template_2.getTemplateMatch(str);
  133. expect(match.templateUrl).toEqual('home.html');
  134. });
  135. it('should get Component with template url and selector below', function () {
  136. var str = "\n Component({\n templateUrl: 'home.html',\n selector: 'page-home\n })\n ";
  137. var match = template_2.getTemplateMatch(str);
  138. expect(match.templateUrl).toEqual('home.html');
  139. });
  140. it('should get Component with template url, spaces, tabs and new lines', function () {
  141. var str = "\t\n\r\n Component(\n {\n\n templateUrl :\n \t\n\r\"c:\\somewindowspath.ts\"\n\n }\n )\n ";
  142. var match = template_2.getTemplateMatch(str);
  143. expect(match.templateUrl).toEqual('c:\\some\windows\path.ts');
  144. });
  145. it('should get Component with template url and spaces', function () {
  146. var str = ' Component ( { templateUrl : ` hi ` } ) ';
  147. var match = template_2.getTemplateMatch(str);
  148. expect(match.component).toEqual('Component ( { templateUrl : ` hi ` } )');
  149. expect(match.templateProperty).toEqual(' templateUrl : ` hi `');
  150. expect(match.templateUrl).toEqual('hi');
  151. });
  152. it('should get Component with template url and back-ticks', function () {
  153. var str = 'Component({templateUrl:`hi`})';
  154. var match = template_2.getTemplateMatch(str);
  155. expect(match.component).toEqual('Component({templateUrl:`hi`})');
  156. expect(match.templateProperty).toEqual('templateUrl:`hi`');
  157. expect(match.templateUrl).toEqual('hi');
  158. });
  159. it('should get Component with template url and double quotes', function () {
  160. var str = 'Component({templateUrl:"hi"})';
  161. var match = template_2.getTemplateMatch(str);
  162. expect(match.component).toEqual('Component({templateUrl:"hi"})');
  163. expect(match.templateProperty).toEqual('templateUrl:"hi"');
  164. expect(match.templateUrl).toEqual('hi');
  165. });
  166. it('should get Component with template url and single quotes', function () {
  167. var str = 'Component({templateUrl:\'hi\'})';
  168. var match = template_2.getTemplateMatch(str);
  169. expect(match.component).toEqual('Component({templateUrl:\'hi\'})');
  170. expect(match.templateProperty).toEqual('templateUrl:\'hi\'');
  171. expect(match.templateUrl).toEqual('hi');
  172. });
  173. it('should get null for Component without string for templateUrl', function () {
  174. var str = 'Component({templateUrl:someVar})';
  175. var match = template_2.getTemplateMatch(str);
  176. expect(match).toEqual(null);
  177. });
  178. it('should get null for Component without templateUrl', function () {
  179. var str = 'Component({template:"hi"})';
  180. var match = template_2.getTemplateMatch(str);
  181. expect(match).toEqual(null);
  182. });
  183. it('should get null for Component without brackets', function () {
  184. var str = 'Component()';
  185. var match = template_2.getTemplateMatch(str);
  186. expect(match).toEqual(null);
  187. });
  188. it('should get null for Component without parentheses', function () {
  189. var str = 'Component';
  190. var match = template_2.getTemplateMatch(str);
  191. expect(match).toEqual(null);
  192. });
  193. it('should get null for Component({})', function () {
  194. var str = 'Component';
  195. var match = template_2.getTemplateMatch(str);
  196. expect(match).toEqual(null);
  197. });
  198. it('should get null for no Component', function () {
  199. var str = 'whatever';
  200. var match = template_2.getTemplateMatch(str);
  201. expect(match).toEqual(null);
  202. });
  203. });
  204. var oldLoggerError = logger_1.Logger.error;
  205. logger_1.Logger.error = function () { };
  206. afterAll(function () {
  207. logger_1.Logger.error = oldLoggerError;
  208. });
  209. });