Skip to content

Commit aebb187

Browse files
marcel0llForbesLindesay
authored andcommitted
Trailing semicolon (#2962)
* Only put trailing semicolon when merging style attributes This is a first draft that tries to maintain the same code behavior without worrying too much about the code quality * Update tests so they reflect the new code behavior All style attributes that received a String won't generate a trailing semicolon * Improve merge trailing semicolon code Check if String is not empty by checking if it its true ('' is false) Get last character of the string using slice(-1) Add semicolon if the last string character is not a semicolon * Use array style indexing instead of `.slice` to get last character
1 parent 8248ba8 commit aebb187

File tree

6 files changed

+15
-16
lines changed

6 files changed

+15
-16
lines changed

packages/pug-runtime/index.js

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,9 @@ function pug_merge(a, b) {
3030
a[key] = (Array.isArray(valA) ? valA : [valA]).concat(b[key] || []);
3131
} else if (key === 'style') {
3232
var valA = pug_style(a[key]);
33+
valA = valA && valA[valA.length - 1] !== ';' ? valA + ';' : valA;
3334
var valB = pug_style(b[key]);
35+
valB = valB && valB[valB.length - 1] !== ';' ? valB + ';' : valB;
3436
a[key] = valA + valB;
3537
} else {
3638
a[key] = b[key];
@@ -109,10 +111,7 @@ function pug_style(val) {
109111
}
110112
return out;
111113
} else {
112-
val += '';
113-
if (val[val.length - 1] !== ';')
114-
return val + ';';
115-
return val;
114+
return val + '';
116115
}
117116
};
118117

packages/pug-runtime/test/index.test.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -132,7 +132,7 @@ addTest('merge', function (merge) {
132132
addTest('style', function (style) {
133133
expect(style(null)).toBe('');
134134
expect(style('')).toBe('');
135-
expect(style('foo: bar')).toBe('foo: bar;');
135+
expect(style('foo: bar')).toBe('foo: bar');
136136
expect(style('foo: bar;')).toBe('foo: bar;');
137137
expect(style({foo: 'bar'})).toBe('foo:bar;');
138138
expect(style({foo: 'bar', baz: 'bash'})).toBe('foo:bar;baz:bash;');
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<div class="avatar-div" style="background-image: url(https://www.gravatar.com/avatar/219b77f9d21de75e81851b6b886057c7);"></div>
1+
<div class="avatar-div" style="background-image: url(https://www.gravatar.com/avatar/219b77f9d21de75e81851b6b886057c7)"></div>

packages/pug/test/cases/styles.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,11 @@
77
</style>
88
</head>
99
<body>
10+
<div style="color:red;background:green"></div>
1011
<div style="color:red;background:green;"></div>
12+
<div style="color:red;background:green"></div>
1113
<div style="color:red;background:green;"></div>
12-
<div style="color:red;background:green;"></div>
13-
<div style="color:red;background:green;"></div>
14-
<div style="color:red;background:green;"></div>
14+
<div style="color:red;background:green"></div>
1515
<div style="color:red;background:green;"></div>
1616
<div style="color:red;background:green;"></div>
1717
<div style="color:red;background:green;"></div>
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11

2-
<div class="avatar-div" style="background-image: url(https://www.gravatar.com/avatar/219b77f9d21de75e81851b6b886057c7);"></div>
2+
<div class="avatar-div" style="background-image: url(https://www.gravatar.com/avatar/219b77f9d21de75e81851b6b886057c7)"></div>

packages/pug/test/pug.test.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -371,8 +371,8 @@ describe('pug', function(){
371371
assert.equal('<a href="http://google.com" title="Some : weird = title"></a>', pug.render('a(href= "http://google.com", title= "Some : weird = title")'));
372372
assert.equal('<label for="name"></label>', pug.render('label(for="name")'));
373373
assert.equal('<meta name="viewport" content="width=device-width"/>', pug.render("meta(name= 'viewport', content='width=device-width')"), 'Test attrs that contain attr separators');
374-
assert.equal('<div style="color= white;"></div>', pug.render("div(style='color= white')"));
375-
assert.equal('<div style="color: white;"></div>', pug.render("div(style='color: white')"));
374+
assert.equal('<div style="color= white"></div>', pug.render("div(style='color= white')"));
375+
assert.equal('<div style="color: white"></div>', pug.render("div(style='color: white')"));
376376
assert.equal('<p class="foo"></p>', pug.render("p('class'='foo')"), 'Test keys with single quotes');
377377
assert.equal('<p class="foo"></p>', pug.render("p(\"class\"= 'foo')"), 'Test keys with double quotes');
378378

@@ -389,10 +389,10 @@ describe('pug', function(){
389389

390390
assert.equal('<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>', pug.render('meta(http-equiv="X-UA-Compatible", content="IE=edge,chrome=1")'));
391391

392-
assert.equal('<div style="background: url(/images/test.png);">Foo</div>', pug.render("div(style= 'background: url(/images/test.png)') Foo"));
393-
assert.equal('<div style="background = url(/images/test.png);">Foo</div>', pug.render("div(style= 'background = url(/images/test.png)') Foo"));
394-
assert.equal('<div style="foo;">Foo</div>', pug.render("div(style= ['foo', 'bar'][0]) Foo"));
395-
assert.equal('<div style="bar;">Foo</div>', pug.render("div(style= { foo: 'bar', baz: 'raz' }['foo']) Foo"));
392+
assert.equal('<div style="background: url(/images/test.png)">Foo</div>', pug.render("div(style= 'background: url(/images/test.png)') Foo"));
393+
assert.equal('<div style="background = url(/images/test.png)">Foo</div>', pug.render("div(style= 'background = url(/images/test.png)') Foo"));
394+
assert.equal('<div style="foo">Foo</div>', pug.render("div(style= ['foo', 'bar'][0]) Foo"));
395+
assert.equal('<div style="bar">Foo</div>', pug.render("div(style= { foo: 'bar', baz: 'raz' }['foo']) Foo"));
396396
assert.equal('<a href="def">Foo</a>', pug.render("a(href='abcdefg'.substr(3,3)) Foo"));
397397
assert.equal('<a href="def">Foo</a>', pug.render("a(href={test: 'abcdefg'}.test.substr(3,3)) Foo"));
398398
assert.equal('<a href="def">Foo</a>', pug.render("a(href={test: 'abcdefg'}.test.substr(3,[0,3][1])) Foo"));

0 commit comments

Comments
 (0)