chore(util): add reusable escape util

lib/features/bendpoints/Bendpoints.js

@@ -14,7 +14,9 @@ import {
   toCanvasCoordinates
 } from './BendpointUtil';
 
-import cssEscape from 'css.escape';
+import {
+  escapeCSS
+} from '../../util/EscapeUtil';
 
 import {
   pointsAligned,
@@ -98,7 +100,7 @@ export default function Bendpoints(
   function getBendpointsContainer(element, create) {
 
     var layer = canvas.getLayer('overlays'),
-        gfx = domQuery('.djs-bendpoints[data-element-id="' + cssEscape(element.id) + '"]', layer);
+        gfx = domQuery('.djs-bendpoints[data-element-id="' + escapeCSS(element.id) + '"]', layer);
 
     if (!gfx && create) {
       gfx = svgCreate('g');

lib/util/EscapeUtil.js

@@ -0,0 +1,14 @@
+export {
+  default as escapeCSS
+} from 'css.escape';
+
+var HTML_ESCAPE_MAP = {
+  '<': '&lt',
+  '>': '&gt'
+};
+
+export function escapeHTML(str) {
+  return str.replace(/[<>]/g, function(match) {
+    return HTML_ESCAPE_MAP[match];
+  });
+}

test/spec/util/EscapeUtilSpec.js

@@ -0,0 +1,20 @@
+import {
+  escapeCSS,
+  escapeHTML
+} from 'lib/util/EscapeUtil';
+
+
+describe('util/EscapeUtil', function() {
+
+  it('escapeCSS', function() {
+    expect(escapeCSS('..ab')).to.eql('\\.\\.ab');
+  });
+
+
+  it('escapeHTML', function() {
+    var htmlStr = '<video src=1 onerror=alert(\'hueh\')>';
+
+    expect(escapeHTML(htmlStr)).to.eql('&ltvideo src=1 onerror=alert(\'hueh\')&gt');
+  });
+
+});