diff --git a/index.js b/index.js index 587cf75..73a9ff5 100644 --- a/index.js +++ b/index.js @@ -2,7 +2,7 @@ var loaderUtils = require("loader-utils"); // using: regex, capture groups, and capture group variables. -var templateUrlRegex = /templateUrl\s*:(\s*['"`](.*?)['"`]\s*([,}]))/gm; +var templateUrlRegex = /templateUrl\s*:(\s*['"`](.*?)([^\\]['"`])\s*)/gm; var stylesRegex = /styleUrls *:(\s*\[[^\]]*?\])/g; var stringRegex = /(['`"])((?:[^\\]\\\1|.)*?)\1/g; diff --git a/test/fixtures/component_with_comment_after_template_url.js b/test/fixtures/component_with_comment_after_template_url.js new file mode 100644 index 0000000..c6e8740 --- /dev/null +++ b/test/fixtures/component_with_comment_after_template_url.js @@ -0,0 +1,11 @@ +var componentWithCommentAfterTemplateUrl = ` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + templateUrl: './some/path/to/file.html' /*my awesome template*/ + }) + export class TestComponent {} +`; + +module.exports = componentWithCommentAfterTemplateUrl; diff --git a/test/fixtures/component_with_comment_between_decorator_and_class.js b/test/fixtures/component_with_comment_between_decorator_and_class.js new file mode 100644 index 0000000..8159431 --- /dev/null +++ b/test/fixtures/component_with_comment_between_decorator_and_class.js @@ -0,0 +1,16 @@ +var componentWithCommentBetweenDecoratorAndClass = ` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + templateUrl: './some/path/to/file.html', + styleUrls : ['./app/css/styles.css'] + }) + + /* + * Comment + */ + export class TestComponent { } +`; + +module.exports = componentWithCommentBetweenDecoratorAndClass; diff --git a/test/fixtures/component_with_only_template_url.js b/test/fixtures/component_with_only_template_url.js new file mode 100644 index 0000000..42afec0 --- /dev/null +++ b/test/fixtures/component_with_only_template_url.js @@ -0,0 +1,12 @@ +var componentWithOnlyTemplateUrl = ` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + templateUrl: './some/path/to/file.html' + //styleUrls: ['./app/css/styles.css'] + }) + export class TestComponent {} +`; + +module.exports = componentWithOnlyTemplateUrl; diff --git a/test/fixtures/component_with_template_url_last.js b/test/fixtures/component_with_template_url_last.js new file mode 100644 index 0000000..7f0a12c --- /dev/null +++ b/test/fixtures/component_with_template_url_last.js @@ -0,0 +1,12 @@ +var componentWithTemplateUrlLast = ` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + styleUrls: ['./app/css/styles.css'], + templateUrl: './some/path/to/file.html' + }) + export class TestComponent {} +`; + +module.exports = componentWithTemplateUrlLast; diff --git a/test/fixtures/index.js b/test/fixtures/index.js index b45a94a..be37504 100644 --- a/test/fixtures/index.js +++ b/test/fixtures/index.js @@ -5,6 +5,10 @@ var componentWithoutRelPeriodSlash = require('./component_without_relative_perio var componentWithSpacing = require('./component_with_spacing.js'); var componentWithSingleLineDecorator = require('./component_with_single_line_decorator.js'); var componentWithTemplateUrlEndingBySpace = require('./component_with_template_url_ending_by_space.js'); +var componentWithTemplateUrlLast = require('./component_with_template_url_last.js'); +var componentWithCommentAfterTemplateUrl = require('./component_with_comment_after_template_url.js'); +var componentWithCommentBetweenDecoratorAndClass = require('./component_with_comment_between_decorator_and_class.js'); +var componentWithOnlyTemplateUrl = require('./component_with_only_template_url.js'); exports.simpleAngularTestComponentFileStringSimple = sampleAngularComponentSimpleFixture; exports.componentWithQuoteInUrls = componentWithQuoteInUrls; @@ -13,3 +17,7 @@ exports.componentWithoutRelPeriodSlash = componentWithoutRelPeriodSlash; exports.componentWithSpacing = componentWithSpacing; exports.componentWithSingleLineDecorator = componentWithSingleLineDecorator; exports.componentWithTemplateUrlEndingBySpace = componentWithTemplateUrlEndingBySpace; +exports.componentWithTemplateUrlLast = componentWithTemplateUrlLast; +exports.componentWithCommentAfterTemplateUrl = componentWithCommentAfterTemplateUrl; +exports.componentWithCommentBetweenDecoratorAndClass = componentWithCommentBetweenDecoratorAndClass; +exports.componentWithOnlyTemplateUrl = componentWithOnlyTemplateUrl; diff --git a/test/loader.spec.js b/test/loader.spec.js index ea730ac..7000591 100644 --- a/test/loader.spec.js +++ b/test/loader.spec.js @@ -193,5 +193,82 @@ describe("loader", function() { ) }); + it("Should convert templateUrl properties when they appear last.", function() { + loader.call({}, fixtures.componentWithTemplateUrlLast) + .should + .be + .eql(` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + styles: [require('./app/css/styles.css')], + template: require('./some/path/to/file.html') + }) + export class TestComponent {} +` + ) + + }); + + it("Should convert templateUrl properties when there is a comment after them.", function() { + + loader.call({}, fixtures.componentWithCommentAfterTemplateUrl) + .should + .be + .eql(` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + template: require('./some/path/to/file.html') /*my awesome template*/ + }) + export class TestComponent {} +` + ) + + }); + + it("Should convert templateUrl properties when there is a comment between decorator and class.", function() { + + loader.call({}, fixtures.componentWithCommentBetweenDecoratorAndClass) + .should + .be + .eql(` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + template: require('./some/path/to/file.html'), + styles: [require('./app/css/styles.css')] + }) + + /* + * Comment + */ + export class TestComponent { } +` + ) + + }); + + it("Should convert templateUrl properties when there is no styles or stylesUrl property.", function() { + + loader.call({}, fixtures.componentWithOnlyTemplateUrl) + .should + .be + .eql(` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + template: require('./some/path/to/file.html') + //styles: [require('./app/css/styles.css')] + }) + export class TestComponent {} +` + ) + + }); });