fix(utilities): add new util to remove html tags and entities

* fix(utilities): add new util to remove html tags and entities

Co-authored-by: Akira Sudoh <asudoh@gmail.com>
Co-authored-by: Anna Wen

Author: annawen1

packages/react/src/__tests__/__snapshots__/storyshots.test.js.snap

@@ -4898,7 +4898,7 @@ exports[`Storyshots Components|LightboxMediaViewer Default 1`] = `
                               className="bx--lightbox-media-viewer__content__desc"
                               data-autoid="dds--lightbox-media-viewer__content__desc"
                             >
-                              <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean et ultricies est.Mauris iaculis eget dolor nec hendrerit. Phasellus at elit sollicitudin, sodales nulla quis, consequat libero. Here are some common categories:</p> 
+                              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean et ultricies est.Mauris iaculis eget dolor nec hendrerit. Phasellus at elit sollicitudin, sodales nulla quis, consequat libero. Here are some common categories:
                             </div>
                           </div>
                         </div>

packages/react/src/components/LightboxMediaViewer/LightboxMediaViewer.js

@@ -6,7 +6,7 @@
  */
 import {
   settings as ddsSettings,
-  markdownToHtml,
+  removeHtmlTagEntities,
 } from '@carbon/ibmdotcom-utilities';
 import React, { useEffect, useState } from 'react';
 import { ExpressiveModal } from '../ExpressiveModal';
@@ -55,10 +55,7 @@ const LightboxMediaViewer = ({ media, ...modalProps }) => {
     };
   }, [media]);
 
-  const videoDesc = markdownToHtml(videoData.description, {
-    createParagraphs: false,
-    cleanString: true,
-  });
+  const videoDesc = removeHtmlTagEntities(videoData.description);
 
   return (
     <section

packages/utilities/src/utilities/index.js

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2016, 2018
+ * Copyright IBM Corp. 2016, 2020
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -12,6 +12,7 @@ export * from './featureflag';
 export * from './geolocation';
 export * from './ipcinfoCookie';
 export * from './markdownToHtml';
+export * from './removeHtmlTagEntities';
 export * from './sameHeight';
 export * from './serialize';
 export * from './settings';

packages/utilities/src/utilities/removeHtmlTagEntities/__tests__/removeHtmlTagEntities.test.js

@@ -0,0 +1,26 @@
+/**
+ * Copyright IBM Corp. 2020
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import { removeHtmlTagEntities } from '..';
+
+describe('Html Tag and Entities remover utility', () => {
+  const str =
+    '<div><div><p>Lorem ipsum dolor sit amet,&nbsp;consectetur adipiscing elit.</p></div></div>';
+
+  it('returns the converted string with no html tags', () => {
+    const output = removeHtmlTagEntities(str, { removeEntities: false });
+    const expected =
+      'Lorem ipsum dolor sit amet,&nbsp;consectetur adipiscing elit.';
+    expect(output.trim()).toBe(expected);
+  });
+
+  it('returns the converted string with no html tags or entities', () => {
+    const output = removeHtmlTagEntities(str);
+    const expected = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
+    expect(output.trim()).toBe(expected);
+  });
+});

packages/utilities/src/utilities/removeHtmlTagEntities/index.js

@@ -0,0 +1,8 @@
+/**
+ * Copyright IBM Corp. 2016, 2020
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+export { default as removeHtmlTagEntities } from './removeHtmlTagEntities';

packages/utilities/src/utilities/removeHtmlTagEntities/removeHtmlTagEntities.js

@@ -0,0 +1,48 @@
+/**
+ * Copyright IBM Corp. 2020
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+const _htmlTagRegex = /<.*?>/g;
+const _cleanStringRegex = /\n|\s{2,}|&([a-zA-Z]+);/g;
+
+/**
+ * Removes any html tags from a string and keeps inner text if any
+ *
+ * @param {string} str String to be checked for html tags
+ * @returns {string} String with html tags stripped out
+ * @private
+ */
+const _removeHtmlTags = str => str.replace(_htmlTagRegex, '');
+
+/**
+ * Cleans string by replacing multiple spaces with a single space
+ * and removing single new lines.
+ *
+ * @param {string} str String to be checked
+ * @returns {string} String with multiple spaces and single new lines removed
+ * @private
+ */
+const _cleanString = str => str.replace(_cleanStringRegex, ' ');
+
+/**
+ *
+ * @param {string} str html string passed in to remove html tags and entities
+ * @param {object} [options={}] Object with options for the conversion
+ * @param {boolean} [options.removeEntities=true] Defines if should remove html entities
+ * @returns {string} String removed of html tags
+ * @example
+ * import { removeHtmlTagEntities } from '@carbon/ibmdotcom-utilities';
+ *
+ * markdownToHtml('<p>example string</p>&nbsp;<p>here</>')
+ * // 'example string here'
+ */
+function removeHtmlTagEntities(str, { removeEntities = true } = {}) {
+  let removedTags = _removeHtmlTags(str);
+  removedTags = removeEntities ? _cleanString(removedTags) : removedTags;
+
+  return removedTags;
+}
+
+export default removeHtmlTagEntities;