555 - Fix HTML value not escaped in DataField (#556)

* Escape HTML in DataField value * Html data prop test
vuejs · Jan 24, 2018 · fb782d3 · fb782d3
1 parent 0f2468a
commit fb782d3
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 3 deletions.
diff --git a/shells/dev/target/NativeTypes.vue b/shells/dev/target/NativeTypes.vue
@@ -64,7 +64,8 @@ export default {
  },
  largeArray: [],
  i: new Set([1, 2, 3, 4, new Set([5, 6, 7, 8]), new Map([[1, 2], [3, 4], [5, new Map([[6, 7]])]])]),
- j: new Map([[1, 2], [3, 4], [5, new Map([[6, 7]])], [8, new Set([1, 2, 3, 4, new Set([5, 6, 7, 8]), new Map([[1, 2], [3, 4], [5, new Map([[6, 7]])]])])]])
+ j: new Map([[1, 2], [3, 4], [5, new Map([[6, 7]])], [8, new Set([1, 2, 3, 4, new Set([5, 6, 7, 8]), new Map([[1, 2], [3, 4], [5, new Map([[6, 7]])]])])]]),
+ html: '<b>Bold</b> <i>Italic</i>'
  }
  },
  computed: {

diff --git a/src/devtools/components/DataField.vue b/src/devtools/components/DataField.vue
@@ -157,7 +157,8 @@ import {
  NAN,
  isPlainObject,
  sortByKey,
- openInEditor
+ openInEditor,
+ escape
 } from 'src/util'
 
 import DataFieldEdit from '../mixins/data-field-edit'
@@ -285,7 +286,7 @@ export default {
  if (typeMatch) {
  return typeMatch[1]
  } else {
- return `<span>"</span>${value}<span>"</span>`
+ return `<span>"</span>${escape(value)}<span>"</span>`
  }
  } else {
  return value

diff --git a/src/util.js b/src/util.js
@@ -426,3 +426,18 @@ export function openInEditor (file) {
  eval(src)
  }
 }
+
+const ESC = {
+ '<': '&lt;',
+ '>': '&gt;',
+ '"': '&quot;',
+ '&': '&amp;'
+}
+
+export function escape (s) {
+ return s.replace(/[<>"&]/g, escapeChar)
+}
+
+function escapeChar (a) {
+ return ESC[a] || a
+}