feat: add 'use' tag of SVG to 'transformAssetUrls' option as default (#…

…45)
vuejs · Jan 8, 2019 · f4e3336 · f4e3336
1 parent ad4affc
commit f4e3336
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 8 deletions.
diff --git a/README.md b/README.md
@@ -81,6 +81,7 @@ interface TemplateCompileOptions {
   //   source: 'src',
   //   img: 'src',
   //   image: 'xlink:href'
+  //   use: 'xlink:href'
   // }
   transformAssetUrls?: AssetURLOptions | boolean
 

diff --git a/lib/templateCompilerModules/assetUrl.ts b/lib/templateCompilerModules/assetUrl.ts
@@ -10,7 +10,8 @@ const defaultOptions: AssetURLOptions = {
   video: ['src', 'poster'],
   source: 'src',
   img: 'src',
-  image: ['xlink:href', 'href']
+  image: ['xlink:href', 'href'],
+  use: ['xlink:href', 'href']
 }
 
 export default (userOptions?: AssetURLOptions) => {

diff --git a/test/compileTemplate.spec.ts b/test/compileTemplate.spec.ts
@@ -152,6 +152,10 @@ test('transform srcset', () => {
   <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink">
     <image xlink:href="./logo.png" />
   </svg>
+  <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink= "http://www.w3.org/1999/xlink">
+    <use xlink:href="./logo.png"/>
+  </svg>
+  </svg>
   <img src="./logo.png" srcset="./logo.png">
   <img src="./logo.png" srcset="./logo.png 2x">
   <img src="./logo.png" srcset="./logo.png, ./logo.png 2x">
@@ -183,16 +187,20 @@ test('transform srcset', () => {
   expect(vnode.children[2].children[0].data.attrs['xlink:href']).toBe(
     'test-url'
   )
+  // use tag (SVG)
+  expect(vnode.children[4].children[0].data.attrs['xlink:href']).toBe(
+    'test-url'
+  )
 
   // image tag with srcset
-  expect(vnode.children[4].data.attrs.srcset).toBe('test-url')
-  expect(vnode.children[6].data.attrs.srcset).toBe('test-url 2x')
+  expect(vnode.children[6].data.attrs.srcset).toBe('test-url')
+  expect(vnode.children[8].data.attrs.srcset).toBe('test-url 2x')
   // image tag with multiline srcset
-  expect(vnode.children[8].data.attrs.srcset).toBe('test-url, test-url 2x')
-  expect(vnode.children[10].data.attrs.srcset).toBe('test-url 2x, test-url')
-  expect(vnode.children[12].data.attrs.srcset).toBe('test-url 2x, test-url 3x')
-  expect(vnode.children[14].data.attrs.srcset).toBe(
+  expect(vnode.children[10].data.attrs.srcset).toBe('test-url, test-url 2x')
+  expect(vnode.children[12].data.attrs.srcset).toBe('test-url 2x, test-url')
+  expect(vnode.children[14].data.attrs.srcset).toBe('test-url 2x, test-url 3x')
+  expect(vnode.children[16].data.attrs.srcset).toBe(
     'test-url, test-url 2x, test-url 3x'
   )
-  expect(vnode.children[16].data.attrs.srcset).toBe('test-url 2x, test-url 3x')
+  expect(vnode.children[18].data.attrs.srcset).toBe('test-url 2x, test-url 3x')
 })