@maizzle/framework 4.2.2 → 4.2.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/package.json +2 -3
  2. package/src/generators/plaintext.js +40 -6
  3. package/src/generators/posthtml/defaultConfig.js +3 -0
  4. package/src/generators/{posthtml.js → posthtml/index.js} +2 -1
  5. package/src/generators/tailwindcss.js +9 -2
  6. package/src/transformers/attributeToStyle.js +3 -2
  7. package/src/transformers/baseUrl.js +27 -26
  8. package/src/transformers/extraAttributes.js +3 -2
  9. package/src/transformers/filters/index.js +8 -2
  10. package/src/transformers/index.js +2 -2
  11. package/src/transformers/markdown.js +2 -1
  12. package/src/transformers/posthtmlMso.js +3 -2
  13. package/src/transformers/preventWidows.js +75 -7
  14. package/src/transformers/removeAttributes.js +48 -9
  15. package/src/transformers/removeInlineBackgroundColor.js +8 -4
  16. package/src/transformers/removeInlineSizes.js +8 -5
  17. package/src/transformers/removeInlinedSelectors.js +19 -5
  18. package/src/transformers/removeUnusedCss.js +12 -12
  19. package/src/transformers/replaceStrings.js +1 -1
  20. package/src/transformers/safeClassNames.js +7 -3
  21. package/src/transformers/shorthandInlineCSS.js +3 -2
  22. package/src/transformers/sixHex.js +13 -14
  23. package/src/transformers/urlParameters.js +3 -2
  24. package/src/utils/helpers.js +2 -1
  25. package/test/expected/transformers/base-url.html +1 -1
  26. package/test/fixtures/posthtml/component.html +2 -2
  27. package/test/stubs/breaking/bad.html +2 -2
  28. package/test/stubs/components/component.html +2 -2
  29. package/test/stubs/events/before-create.html +1 -1
  30. package/test/stubs/plaintext/plaintext.html +1 -1
  31. package/test/stubs/templates/1.html +1 -1
  32. package/test/stubs/templates/2.html +1 -0
  33. package/test/stubs/templates/2.test +1 -1
  34. package/test/test-posthtml.js +20 -31
  35. package/test/test-tailwindcss.js +6 -6
  36. package/test/test-todisk.js +14 -64
  37. package/test/test-tostring.js +20 -15
  38. package/test/test-transformers.js +113 -21
  39. package/test/expected/posthtml/fetch.html +0 -5
  40. package/test/fixtures/posthtml/fetch.html +0 -9
package/test/test-transformers.js CHANGED
@@ -94,7 +94,7 @@ test('remove unused CSS', async t => {
94
94
  </style>
95
95
  </head>
96
96
  <body>
97
- <div class="foo">test div with some text</div>
97
+ <div class="foo {{ test }}">test div with some text</div>
98
98
  </body>
99
99
  </html>`
100
100
 
@@ -107,7 +107,7 @@ test('remove unused CSS', async t => {
107
107
  </style>
108
108
  </head>
109
109
  <body>
110
- <div class="foo">test div with some text</div>
110
+ <div class="foo {{ test }}">test div with some text</div>
111
111
  </body>
112
112
  </html>`
113
113
 
@@ -119,15 +119,17 @@ test('remove unused CSS', async t => {
119
119
  </style>
120
120
  </head>
121
121
  <body>
122
- <div class="foo">test div with some text</div>
122
+ <div class="foo {{ test }}">test div with some text</div>
123
123
  </body>
124
124
  </html>`
125
125
 
126
- const withOptions = await Maizzle.removeUnusedCSS(html, {whitelist: ['.bar*']})
127
126
  const enabled = await Maizzle.removeUnusedCSS(html, true)
127
+ const disabled = await Maizzle.removeUnusedCSS(html, {removeUnusedCSS: false})
128
+ const withOptions = await Maizzle.removeUnusedCSS(html, {whitelist: ['.bar*']})
128
129
 
129
- t.is(withOptions, result1)
130
130
  t.is(enabled, result2)
131
+ t.is(disabled, html)
132
+ t.is(withOptions, result1)
131
133
  })
132
134
 
133
135
  test('remove unused CSS (disabled)', async t => {
@@ -163,9 +165,16 @@ test('remove unused CSS (disabled)', async t => {
163
165
  })
164
166
 
165
167
  test('remove attributes', async t => {
166
- const html = await Maizzle.removeAttributes(`<div style="" role="article"></div>`, [{name: 'role', value: 'article'}])
168
+ const html = await Maizzle.removeAttributes(
169
+ `<div style="" remove keep role="article" delete-me="with-regex"></div>`,
170
+ [
171
+ {name: 'role', value: 'article'},
172
+ 'remove',
173
+ {name: 'delete-me', value: /^with/}
174
+ ]
175
+ )
167
176
 
168
- t.is(html, '<div></div>')
177
+ t.is(html, '<div keep></div>')
169
178
  })
170
179
 
171
180
  test('extra attributes', async t => {
@@ -373,9 +382,62 @@ test('attribute to style', async t => {
373
382
  })
374
383
 
375
384
  test('prevent widows', async t => {
376
- const html = await Maizzle.preventWidows('lorem ipsum dolor')
385
+ const html = await Maizzle.preventWidows(`
386
+ <!--[if mso]>
387
+ <p>A paragraph inside an Outlook MSO comment</p>
388
+ <![endif]-->
389
+ <div>Text following an MSO comment</div>
390
+ `)
391
+
392
+ t.is(html, `
393
+ <!--[if mso]>
394
+ <p>A paragraph inside an Outlook MSO&nbsp;comment</p>
395
+ <![endif]-->
396
+ <div>Text following an MSO&nbsp;comment</div>
397
+ `)
398
+ })
377
399
 
378
- t.is(html, 'lorem ipsum&nbsp;dolor')
400
+ test('prevent widows (with options)', async t => {
401
+ const html = await Maizzle.preventWidows(`
402
+ <div no-widows>
403
+ <p>Text following an MSO comment</p>
404
+ <!--[if mso 15]>
405
+ <p>A paragraph inside an Outlook MSO comment</p>
406
+ <p>unescaped {{{ foo }}}</p>
407
+ <![endif]-->
408
+ <p>expression {{ foo }}</p>
409
+ <!--[if !mso]><!-->
410
+ <div>All Outlooks will ignore this</div>
411
+ <!--<![endif]-->
412
+ <p>unescaped {{{ foo }}}</p>
413
+ </div>
414
+ <p>Should not remove widows here</p>
415
+ `, {
416
+ attrName: 'no-widows',
417
+ minWordCount: 3,
418
+ ignore: [
419
+ {
420
+ heads: 'foo',
421
+ tails: 'bar'
422
+ }
423
+ ]
424
+ })
425
+
426
+ t.is(html, `
427
+ <div>
428
+ <p>Text following an MSO&nbsp;comment</p>
429
+ <!--[if mso 15]>
430
+ <p>A paragraph inside an Outlook MSO&nbsp;comment</p>
431
+ <p>unescaped {{{ foo }}}</p>
432
+ <![endif]-->
433
+ <p>expression {{ foo }}</p>
434
+ <!--[if !mso]><!-->
435
+ <div>All Outlooks will ignore this</div>
436
+ <!--<![endif]-->
437
+ <p>unescaped {{{ foo }}}</p>
438
+ </div>
439
+ <p>Should not remove widows here</p>
440
+ `)
379
441
  })
380
442
 
381
443
  test('markdown (disabled)', async t => {
@@ -427,7 +489,7 @@ test('remove inlined selectors', async t => {
427
489
  </style>
428
490
  </head>
429
491
  <body>
430
- <div id="keepId" class="remove keep ignore foo-class" style="color: red; display: inline">
492
+ <div no-value id="keepId" class="remove keep ignore foo-class" style="color: red; display: inline">
431
493
  <h1 class="m-0 mb-4 mt-0 hover-text-blue" style="margin: 0 0 16px;">Title</h1>
432
494
  <img src="https://example.com/image.jpg" style="border: 0; vertical-align: middle">
433
495
  <div id="keepId" class="remove keep ignore" style="color: red; display: inline">text</div>
@@ -435,11 +497,10 @@ test('remove inlined selectors', async t => {
435
497
  </body>
436
498
  </html>`
437
499
 
438
- const expected = `<!DOCTYPE html>
500
+ const expectedHTML = `<!DOCTYPE html>
439
501
  <html>
440
502
  <head>
441
- <style>
442
- .hover-text-blue:hover {
503
+ <style>.hover-text-blue:hover {
443
504
  color: #00a8ff;
444
505
  }
445
506
 
@@ -454,14 +515,11 @@ test('remove inlined selectors', async t => {
454
515
 
455
516
  @media (max-width: 600px) {
456
517
  .ignore {color: blue}
457
- }
458
- </style>
459
- <style>
460
- .keep {margin: 0}
461
- </style>
518
+ }</style>
519
+ <style>.keep {margin: 0}</style>
462
520
  </head>
463
521
  <body>
464
- <div id="keepId" class="keep foo-class" style="color: red; display: inline">
522
+ <div no-value id="keepId" class="keep foo-class" style="color: red; display: inline">
465
523
  <h1 class="hover-text-blue" style="margin: 0 0 16px">Title</h1>
466
524
  <img src="https://example.com/image.jpg" style="border: 0; vertical-align: middle">
467
525
  <div id="keepId" class="keep" style="color: red; display: inline">text</div>
@@ -469,9 +527,43 @@ test('remove inlined selectors', async t => {
469
527
  </body>
470
528
  </html>`
471
529
 
472
- const result = await Maizzle.removeInlinedClasses(html)
530
+ const html2 = `<!DOCTYPE html>
531
+ <html>
532
+ <head><style>
533
+ img {
534
+ border: 0;
535
+ vertical-align: middle
536
+ }
537
+ </style></head>
538
+ <body>
539
+ <img src="https://example.com/image.jpg" style="border: 0; vertical-align: middle">
540
+ </body>
541
+ </html>`
473
542
 
474
- t.is(result, expected)
543
+ const expectedNoEmptyStyleTags = `<!DOCTYPE html>
544
+ <html>
545
+ <head></head>
546
+ <body>
547
+ <img src="https://example.com/image.jpg" style="border: 0; vertical-align: middle">
548
+ </body>
549
+ </html>`
550
+
551
+ const basic = await Maizzle.removeInlinedClasses(html)
552
+ const noEmptyStyle = await Maizzle.removeInlinedClasses(html2)
553
+
554
+ const withPostHTMLOptions = await Maizzle.removeInlinedClasses(html, {
555
+ build: {
556
+ posthtml: {
557
+ options: {
558
+ recognizeNoValueAttribute: true
559
+ }
560
+ }
561
+ }
562
+ })
563
+
564
+ t.is(basic, expectedHTML)
565
+ t.is(withPostHTMLOptions, expectedHTML)
566
+ t.is(noEmptyStyle, expectedNoEmptyStyleTags)
475
567
  })
476
568
 
477
569
  test('remove inlined selectors (disabled)', async t => {
package/test/expected/posthtml/fetch.html DELETED
@@ -1,5 +0,0 @@
1
- Leanne Graham
2
-
3
- Ervin Howell
4
-
5
- Clementine Bauch
package/test/fixtures/posthtml/fetch.html DELETED
@@ -1,9 +0,0 @@
1
- <extends src="test/stubs/layouts/basic.html">
2
- <block name="template">
3
- <fetch url="test/stubs/data.json">
4
- <each loop="user in response">
5
- [[ user.name ]]
6
- </each>
7
- </fetch>
8
- </block>
9
- </extends>