@@ -50,4 +50,49 @@ describe("url", function() {
50
50
test ( "keyframe background img" , "@keyframes anim { background: green url('img.png') xyz }" , [
51
51
[ 1 , "@keyframes anim { background: green url({./img.png}) xyz }" , "" ]
52
52
] ) ;
53
+
54
+ test ( "background img with url" , ".class { background: green url( \"img.png\" ) xyz }" , [
55
+ [ 1 , ".class { background: green url( \"img.png\" ) xyz }" , "" ]
56
+ ] , "?-url" ) ;
57
+ test ( "background img 2 with url" , ".class { background: green url(~img/png) url(aaa) xyz }" , [
58
+ [ 1 , ".class { background: green url(~img/png) url(aaa) xyz }" , "" ]
59
+ ] , "?-url" ) ;
60
+ test ( "background img 3 with url" , ".class { background: green url( 'img.png' ) xyz }" , [
61
+ [ 1 , ".class { background: green url( 'img.png' ) xyz }" , "" ]
62
+ ] , "?-url" ) ;
63
+ test ( "background img absolute with url" , ".class { background: green url(/img.png) xyz }" , [
64
+ [ 1 , ".class { background: green url(/img.png) xyz }" , "" ]
65
+ ] , "?-url" ) ;
66
+ test ( "background img external with url" ,
67
+ ".class { background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz }" , [
68
+ [ 1 , ".class { background: green url(data:image/png;base64,AAA) url(http://example.com/image.jpg) url(//example.com/image.png) xyz }" , "" ]
69
+ ] , "?-url" ) ;
70
+ test ( "background img external data with url" ,
71
+ ".class { background-image: url(\"data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 26' fill='%23007aff'><rect width='4' height='4'/><rect x='8' y='1' width='34' height='2'/><rect y='11' width='4' height='4'/><rect x='8' y='12' width='34' height='2'/><rect y='22' width='4' height='4'/><rect x='8' y='23' width='34' height='2'/></svg>\") }" , [
72
+ [ 1 , ".class { background-image: url(\"data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 42 26' fill='%23007aff'><rect width='4' height='4'/><rect x='8' y='1' width='34' height='2'/><rect y='11' width='4' height='4'/><rect x='8' y='12' width='34' height='2'/><rect y='22' width='4' height='4'/><rect x='8' y='23' width='34' height='2'/></svg>\") }" , "" ]
73
+ ] , "?-url" ) ;
74
+ test ( "data url in filter with url" ,
75
+ ".class { filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\"><filter id=\"filter\"><feGaussianBlur in=\"SourceAlpha\" stdDeviation=\"0\" /><feOffset dx=\"1\" dy=\"2\" result=\"offsetblur\" /><feFlood flood-color=\"rgba(255,255,255,1)\" /><feComposite in2=\"offsetblur\" operator=\"in\" /><feMerge><feMergeNode /><feMergeNode in=\"SourceGraphic\" /></feMerge></filter></svg>#filter'); }" , [
76
+ [ 1 , ".class { filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns=\"http://www.w3.org/2000/svg\"><filter id=\"filter\"><feGaussianBlur in=\"SourceAlpha\" stdDeviation=\"0\" /><feOffset dx=\"1\" dy=\"2\" result=\"offsetblur\" /><feFlood flood-color=\"rgba(255,255,255,1)\" /><feComposite in2=\"offsetblur\" operator=\"in\" /><feMerge><feMergeNode /><feMergeNode in=\"SourceGraphic\" /></feMerge></filter></svg>#filter'); }" , "" ]
77
+ ] , "?-url" ) ;
78
+ test ( "filter hash with url" ,
79
+ ".highlight { filter: url(#highlight); }" , [
80
+ [ 1 , ".highlight { filter: url(#highlight); }" , "" ]
81
+ ] , "?-url" ) ;
82
+ test ( "filter hash quotation marks with url" ,
83
+ ".highlight { filter: url('#line-marker'); }" , [
84
+ [ 1 , ".highlight { filter: url('#line-marker'); }" , "" ]
85
+ ] , "?-url" ) ;
86
+ test ( "font face with url" , "@font-face { src: url(regular.woff) format('woff'), url(~truetype/regular.ttf) format('truetype') }" , [
87
+ [ 1 , "@font-face { src: url(regular.woff) format('woff'), url(~truetype/regular.ttf) format('truetype') }" , "" ]
88
+ ] , "?-url" ) ;
89
+ test ( "media query with url" , "@media (min-width: 500px) { body { background: url(image.png); } }" , [
90
+ [ 1 , "@media (min-width: 500px) { body { background: url(image.png); } }" , "" ]
91
+ ] , "?-url" ) ;
92
+ test ( "url in string with url" , "a { content: \"do not use url(path)\"; } b { content: 'do not \"use\" url(path)'; }" , [
93
+ [ 1 , "a { content: \"do not use url(path)\"; } b { content: 'do not \"use\" url(path)'; }" , "" ]
94
+ ] , "?-url" ) ;
95
+ test ( "keyframe background img with url" , "@keyframes anim { background: green url('img.png') xyz }" , [
96
+ [ 1 , "@keyframes anim { background: green url('img.png') xyz }" , "" ]
97
+ ] , "?-url" ) ;
53
98
} ) ;
0 commit comments