Merge branch '247127-remark-over-grey-matter' into 'master'

Initial gray-matter replacement

Closes #247127

See merge request gitlab-org/gitlab!42641

app/assets/javascripts/static_site_editor/services/front_matterify.js

+import jsYaml from 'js-yaml';
+
+const NEW_LINE = '\n';
+
+const hasMatter = (firstThreeChars, fourthChar) => {
+  const isYamlDelimiter = firstThreeChars === '---';
+  const isFourthCharNewline = fourthChar === NEW_LINE;
+  return isYamlDelimiter && isFourthCharNewline;
+};
+
+export const frontMatterify = source => {
+  let index = 3;
+  let offset;
+  const delimiter = source.slice(0, index);
+  const type = 'yaml';
+  const NO_FRONTMATTER = {
+    source,
+    matter: null,
+    spacing: null,
+    content: source,
+    delimiter: null,
+    type: null,
+  };
+
+  if (!hasMatter(delimiter, source.charAt(index))) {
+    return NO_FRONTMATTER;
+  }
+
+  offset = source.indexOf(delimiter, index);
+
+  // Finds the end delimiter that starts at a new line
+  while (offset !== -1 && source.charAt(offset - 1) !== NEW_LINE) {
+    index = offset + delimiter.length;
+    offset = source.indexOf(delimiter, index);
+  }
+
+  if (offset === -1) {
+    return NO_FRONTMATTER;
+  }
+
+  const matterStr = source.slice(index, offset);
+  const matter = jsYaml.safeLoad(matterStr);
+
+  let content = source.slice(offset + delimiter.length);
+  let spacing = '';
+  let idx = 0;
+  while (content.charAt(idx).match(/(\s|\n)/)) {
+    spacing += content.charAt(idx);
+    idx += 1;
+  }
+  content = content.replace(spacing, '');
+
+  return {
+    source,
+    matter,
+    spacing,
+    content,
+    delimiter,
+    type,
+  };
+};
+
+export const stringify = ({ matter, spacing, content, delimiter }, newMatter) => {
+  const matterObj = newMatter || matter;
+
+  if (!matterObj) {
+    return content;
+  }
+
+  const header = `${delimiter}${NEW_LINE}${jsYaml.safeDump(matterObj)}${delimiter}`;
+  const body = `${spacing}${content}`;
+  return `${header}${body}`;
+};

app/assets/javascripts/static_site_editor/services/parse_source_file.js

-import grayMatter from 'gray-matter';
+import { frontMatterify, stringify } from './front_matterify';
 
 const parseSourceFile = raw => {
-  const remake = source => grayMatter(source, {});
+  const remake = source => frontMatterify(source);
 
   let editable = remake(raw);
 
@@ -13,20 +13,17 @@ const parseSourceFile = raw => {
     }
   };
 
-  const trimmedEditable = () => grayMatter.stringify(editable).trim();
+  const content = (isBody = false) => (isBody ? editable.content : stringify(editable));
 
-  const content = (isBody = false) => (isBody ? editable.content.trim() : trimmedEditable()); // gray-matter internally adds an eof newline so we trim to bypass, open issue: https://github.com/jonschlinkert/gray-matter/issues/96
-
-  const matter = () => editable.data;
+  const matter = () => editable.matter;
 
   const syncMatter = settings => {
-    const source = grayMatter.stringify(editable.content, settings);
-    syncContent(source);
+    editable.matter = settings;
   };
 
-  const isModified = () => trimmedEditable() !== raw;
+  const isModified = () => stringify(editable) !== raw;
 
-  const hasMatter = () => editable.matter.length > 0;
+  const hasMatter = () => Boolean(editable.matter);
 
   return {
     matter,

package.json

@@ -93,7 +93,6 @@
     "glob": "^7.1.6",
     "graphql": "^14.7.0",
     "graphql-tag": "^2.10.1",
-    "gray-matter": "^4.0.2",
     "immer": "^7.0.7",
     "imports-loader": "^0.8.0",
     "ipaddr.js": "^1.9.1",

spec/frontend/static_site_editor/services/front_matterify_spec.js

+import {
+  sourceContentYAML as content,
+  sourceContentHeaderObjYAML as yamlFrontMatterObj,
+  sourceContentSpacing as spacing,
+  sourceContentBody as body,
+} from '../mock_data';
+
+import { frontMatterify, stringify } from '~/static_site_editor/services/front_matterify';
+
+describe('static_site_editor/services/front_matterify', () => {
+  const frontMatterifiedContent = {
+    source: content,
+    matter: yamlFrontMatterObj,
+    spacing,
+    content: body,
+    delimiter: '---',
+    type: 'yaml',
+  };
+  const frontMatterifiedBody = {
+    source: body,
+    matter: null,
+    spacing: null,
+    content: body,
+    delimiter: null,
+    type: null,
+  };
+
+  describe('frontMatterify', () => {
+    it.each`
+      frontMatterified           | target
+      ${frontMatterify(content)} | ${frontMatterifiedContent}
+      ${frontMatterify(body)}    | ${frontMatterifiedBody}
+    `('returns $target from $frontMatterified', ({ frontMatterified, target }) => {
+      expect(frontMatterified).toEqual(target);
+    });
+  });
+
+  describe('stringify', () => {
+    it.each`
+      stringified                           | target
+      ${stringify(frontMatterifiedContent)} | ${content}
+      ${stringify(frontMatterifiedBody)}    | ${body}
+    `('returns $target from $stringified', ({ stringified, target }) => {
+      expect(stringified).toBe(target);
+    });
+  });
+});

yarn.lock

@@ -5586,16 +5586,6 @@ graphql@^14.7.0:
   dependencies:
     iterall "^1.2.2"
 
-gray-matter@^4.0.2:
-  version "4.0.2"
-  resolved "https://registry.yarnpkg.com/gray-matter/-/gray-matter-4.0.2.tgz#9aa379e3acaf421193fce7d2a28cebd4518ac454"
-  integrity sha512-7hB/+LxrOjq/dd8APlK0r24uL/67w7SkYnfwhNFwg/VDIGWGmduTDYf3WNstLW2fbbmRwrDGCVSJ2isuf2+4Hw==
-  dependencies:
-    js-yaml "^3.11.0"
-    kind-of "^6.0.2"
-    section-matter "^1.0.0"
-    strip-bom-string "^1.0.0"
-
 growly@^1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/growly/-/growly-1.3.0.tgz#f10748cbe76af964b7c96c93c6bcc28af120c081"
@@ -7114,7 +7104,7 @@ js-cookie@^2.2.1:
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
   integrity sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==
 
-js-yaml@^3.11.0, js-yaml@^3.12.0, js-yaml@^3.13.1, js-yaml@~3.13.1:
+js-yaml@^3.12.0, js-yaml@^3.13.1, js-yaml@~3.13.1:
   version "3.13.1"
   resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847"
   integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==
@@ -10500,14 +10490,6 @@ scss-tokenizer@^0.2.3:
     js-base64 "^2.1.8"
     source-map "^0.4.2"
 
-section-matter@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/section-matter/-/section-matter-1.0.0.tgz#e9041953506780ec01d59f292a19c7b850b84167"
-  integrity sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==
-  dependencies:
-    extend-shallow "^2.0.1"
-    kind-of "^6.0.0"
-
 select-hose@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/select-hose/-/select-hose-2.0.0.tgz#625d8658f865af43ec962bfc376a37359a4994ca"
@@ -11170,11 +11152,6 @@ strip-ansi@^6.0.0:
   dependencies:
     ansi-regex "^5.0.0"
 
-strip-bom-string@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/strip-bom-string/-/strip-bom-string-1.0.0.tgz#e5211e9224369fbb81d633a2f00044dc8cedad92"
-  integrity sha1-5SEekiQ2n7uB1jOi8ABE3IztrZI=
-
 strip-bom@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/strip-bom/-/strip-bom-2.0.0.tgz#6219a85616520491f35788bdbf1447a99c7e6b0e"