feat: prepare target

show-docs · Dec 1, 2023 · e589360 · e589360
1 parent 6895df7
commit e589360
Show file tree

Hide file tree

Showing 16 changed files with 134 additions and 125 deletions.
diff --git a/lib/ast.mjs b/lib/ast.mjs
@@ -6,34 +6,11 @@ function attrString(attr) {
  : '';
 }
 
-// eslint-disable-next-line consistent-return
-function stringifier(buff, doc) {
- switch (doc.type) {
- case 'text': {
- return buff + doc.value;
- }
- case 'tag': {
- // eslint-disable-next-line no-param-reassign
- buff += `<${doc.name} ${attrString(doc.attr)}${doc.void ? ' />' : '>'}`;
-
- if (doc.void) {
- return buff;
- }
-
- return `${
- buff +
- doc.children.reduce(
- (accumulator, element) => stringifier(accumulator, element),
- '',
- )
- }</${doc.name}>`;
- }
- default:
- }
-}
-
-export function stringify(doc) {
- return doc.reduce((token, rootEl) => {
- return token + stringifier('', rootEl);
- }, '');
+export function create(target, { tag, attr, child }) {
+ return {
+ type: target,
+ value: child
+ ? [`<${tag} ${attrString(attr)}>`, child, `</${tag}>`].join('')
+ : `<${tag} ${attrString(attr)} />`,
+ };
 }
diff --git a/lib/index.mjs b/lib/index.mjs
@@ -9,16 +9,17 @@ export function remarkKroki({
  headers = {},
  alias = [],
  output = outputType[0],
+ target = 'html',
 } = {}) {
- validate({ server, headers, alias, output });
+ validate({ server, headers, alias, output, target });
 
  const condition = isKroki(alias);
 
  return async (tree) => {
  const temp = [];
 
  visit(tree, condition, (node) => {
- temp.push(transform({ node, server, headers, output }));
+ temp.push(transform({ node, server, headers, output, target }));
  });
 
  // eslint-disable-next-line no-empty

diff --git a/lib/transform.mjs b/lib/transform.mjs
@@ -1,6 +1,6 @@
 import { getValue, parse } from 'markdown-code-block-meta';
 
-import { stringify } from './ast.mjs';
+import { create } from './ast.mjs';
 import { fetchData, mime, toDataURL } from './utils.mjs';
 
 /* eslint-disable no-param-reassign */
@@ -21,69 +21,55 @@ const modes = {
  },
  ];
  },
- 'object-base64': ({ node, diagramType, data, alt }) => {
- node.type = 'html';
- node.value = stringify([
- {
- type: 'tag',
- name: 'object',
+ 'object-base64': ({ target, node, diagramType, data, alt }) => {
+ Object.assign(
+  node,
+ create(target, {
+ tag: 'object',
+ child: 'Load SVG fail...',
  attr: {
  type: mime,
  class: 'kroki-object',
  'data-type': diagramType,
  title: alt || diagramType,
  data: toDataURL(data),
  },
- children: [
- {
- type: 'text',
- value: 'Load SVG fail...',
- },
- ],
- },
- ]);
+ }),
+ );
  },
- 'img-html-base64': ({ node, diagramType, data, alt }) => {
- node.type = 'html';
- node.value = stringify([
- {
- type: 'tag',
- name: 'img',
- void: true,
+ 'img-html-base64': ({ target, node, diagramType, data, alt }) => {
+ Object.assign(
+ node,
+ create(target, {
+ tag: 'img',
  attr: {
  class: 'kroki-image',
  alt: alt || diagramType,
  'data-type': diagramType,
  src: toDataURL(data),
  },
- },
- ]);
+ }),
+ );
  },
- 'inline-svg': ({ node, diagramType, data, alt }) => {
- node.type = 'html';
- node.value = stringify([
- {
- type: 'tag',
- name: 'div',
+ 'inline-svg': ({ target, node, diagramType, data, alt }) => {
+ Object.assign(
+ node,
+ create(target, {
+ tag: 'div',
  attr: {
  class: 'kroki-inline-svg',
  'data-type': diagramType,
  'data-alt': alt || diagramType,
  },
- children: [
- {
- type: 'text',
- value: removeXML(data.toString()),
- },
- ],
- },
- ]);
+ child: removeXML(data.toString()),
+ }),
+ );
  },
 };
 
 export const outputType = Object.keys(modes);
 
-export async function transform({ node, server, headers, output }) {
+export async function transform({ node, server, headers, output, target }) {
  const { meta, value, lang } = node;
 
  const object = parse(meta);
@@ -104,5 +90,5 @@ export async function transform({ node, server, headers, output }) {
  delete node.value;
  delete node.meta;
 
- modes[output]({ node, diagramType, data, alt });
+ modes[output]({ node, diagramType, data, alt, target });
 }
diff --git a/lib/validate.mjs b/lib/validate.mjs
@@ -4,7 +4,9 @@ import isPlainObject from 'is-plain-obj';
 
 import { outputType } from './transform.mjs';
 
-export function validate({ server, headers, alias, output }) {
+const targets = ['html', 'raw', 'mdx1', 'mdx2+'];
+
+export function validate({ server, headers, alias, output, target }) {
  try {
  assert(
  typeof server === 'string',
@@ -43,13 +45,13 @@ export function validate({ server, headers, alias, output }) {
  );
 
  assert(
- typeof output === 'string',
- new TypeError('`output` should be string'),
+ outputType.includes(output),
+ new TypeError(`\`output\` should be one of \`${outputType.join('/')}\``),
  );
 
  assert(
- outputType.includes(output),
- new TypeError(`\`output\` should be one of \`${outputType.join('/')}\``),
+ targets.includes(target),
+ new TypeError(`\`target\` should be one of \`${targets.join('/')}\``),
  );
  } catch (error) {
  throw error.actual || error;

diff --git a/package.json b/package.json
@@ -75,7 +75,7 @@
  "access": "public",
  "registry": "https://registry.npmjs.org/"
  },
- "packageManager": "pnpm@8.10.5",
+ "packageManager": "pnpm@8.11.0",
  "eslintConfig": {
  "extends": "@nice-move/eslint-config-base"
  },

diff --git a/test/helper/lib.mjs b/test/helper/lib.mjs
@@ -28,16 +28,17 @@ export async function TransformSnapshot(t, input, option = {}, slice = false) {
 
  const ast = instance.parse(input);
 
- t.snapshot(input);
- t.snapshot(removePST(ast));
+ t.snapshot(input, 'input');
+ t.snapshot(removePST(ast), 'ast');
 
  const tree = removePST(await instance.run(ast));
 
- t.snapshot(tree);
+ t.snapshot(tree, 'parsed');
 
  const output = await instance
  .process(input)
  .then((file) => file.toString().trim())
  .then((text) => (slice ? text.slice(0, 4000) : text));
- t.snapshot(output);
+
+ t.snapshot(output, 'result');
 }
diff --git a/test/output.mjs b/test/output.mjs
@@ -21,6 +21,13 @@ function macro(t, { output }) {
 
 const mode = ['inline-svg', 'img-base64', 'img-html-base64', 'object-base64'];
 
+// const targets = ['html', 'raw', 'mdx1', 'mdx2+'];
+
 for (const output of mode) {
- test(output, macro, { output });
+ // for (const target of targets) {
+ test(output, macro, {
+ output,
+ // target,
+ });
+ // }
 }
diff --git a/test/snapshots/base.mjs.md b/test/snapshots/base.mjs.md
@@ -6,7 +6,7 @@ Generated by [AVA](https://avajs.dev).
 
 ## empty
 
-> Snapshot 1
+> input
 
  `␊
  \`\`\`kroki␊
@@ -16,7 +16,7 @@ Generated by [AVA](https://avajs.dev).
  \`\`\`␊
  `
 
-> Snapshot 2
+> ast
 
  [
   {
@@ -33,7 +33,7 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 3
+> parsed
 
  [
   {
@@ -50,7 +50,7 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 4
+> result
 
  `\`\`\`kroki␊
  \`\`\`␊
@@ -60,15 +60,15 @@ Generated by [AVA](https://avajs.dev).
 
 ## okay
 
-> Snapshot 1
+> input
 
  `␊
  \`\`\`kroki type=plantuml alt=abc␊
   A --> B␊
  \`\`\`␊
  `
 
-> Snapshot 2
+> ast
 
  [
   {
@@ -79,7 +79,7 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 3
+> parsed
 
  [
   {
@@ -98,21 +98,21 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 4
+> result
 
  '![abc](data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXMtYXNjaWkiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBjb250ZW50U3R5bGVUeXBlPSJ0ZXh0L2NzcyIgaGVpZ2h0PSIxMDVweCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSIgc3R5bGU9IndpZHRoOjY4cHg7aGVpZ2h0OjEwNXB4O2JhY2tncm91bmQ6I0ZGRkZGRjsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY4IDEwNSIgd2lkdGg9IjY4cHgiIHpvb21BbmRQYW49Im1hZ25pZnkiPjxkZWZzLz48Zz48bGluZSBzdHlsZT0ic3Ryb2tlOiMxODE4MTg7c3Ryb2tlLXdpZHRoOjAuNTtzdHJva2UtZGFzaGFycmF5OjUuMCw1LjA7IiB4MT0iMTYiIHgyPSIxNiIgeTE9IjM2LjI5NjkiIHkyPSI3MC4yOTY5Ii8+PGxpbmUgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDowLjU7c3Ryb2tlLWRhc2hhcnJheTo1LjAsNS4wOyIgeDE9IjUwIiB4Mj0iNTAiIHkxPSIzNi4yOTY5IiB5Mj0iNzAuMjk2OSIvPjxyZWN0IGZpbGw9IiNFMkUyRjAiIGhlaWdodD0iMzAuMjk2OSIgcng9IjIuNSIgcnk9IjIuNSIgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDowLjU7IiB3aWR0aD0iMjMiIHg9IjUiIHk9IjUiLz48dGV4dCBmaWxsPSIjMDAwMDAwIiBmb250LWZhbWlseT0ic2Fucy1zZXJpZiIgZm9udC1zaXplPSIxNCIgbGVuZ3RoQWRqdXN0PSJzcGFjaW5nIiB0ZXh0TGVuZ3RoPSI5IiB4PSIxMiIgeT0iMjQuOTk1MSI+QTwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjIzIiB4PSI1IiB5PSI2OS4yOTY5Ii8+PHRleHQgZmlsbD0iIzAwMDAwMCIgZm9udC1mYW1pbHk9InNhbnMtc2VyaWYiIGZvbnQtc2l6ZT0iMTQiIGxlbmd0aEFkanVzdD0ic3BhY2luZyIgdGV4dExlbmd0aD0iOSIgeD0iMTIiIHk9Ijg5LjI5MiI+QTwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjI0IiB4PSIzOCIgeT0iNSIvPjx0ZXh0IGZpbGw9IiMwMDAwMDAiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXNpemU9IjE0IiBsZW5ndGhBZGp1c3Q9InNwYWNpbmciIHRleHRMZW5ndGg9IjEwIiB4PSI0NSIgeT0iMjQuOTk1MSI+QjwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjI0IiB4PSIzOCIgeT0iNjkuMjk2OSIvPjx0ZXh0IGZpbGw9IiMwMDAwMDAiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXNpemU9IjE0IiBsZW5ndGhBZGp1c3Q9InNwYWNpbmciIHRleHRMZW5ndGg9IjEwIiB4PSI0NSIgeT0iODkuMjkyIj5CPC90ZXh0Pjxwb2x5Z29uIGZpbGw9IiMxODE4MTgiIHBvaW50cz0iMzgsNDguMjk2OSw0OCw1Mi4yOTY5LDM4LDU2LjI5NjksNDIsNTIuMjk2OSIgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDoxLjA7Ii8+PGxpbmUgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDoxLjA7c3Ryb2tlLWRhc2hhcnJheToyLjAsMi4wOyIgeDE9IjE2LjUiIHgyPSI0NCIgeTE9IjUyLjI5NjkiIHkyPSI1Mi4yOTY5Ii8+PCEtLVNSQz1bU3JKR3JSTEpTMDgwXS0tPjwvZz48L3N2Zz4=)'
 
 ## alias
 
-> Snapshot 1
+> input
 
  `␊
  \`\`\`plantuml type=mermaid alt=abc␊
   A --> B␊
  \`\`\`␊
  `
 
-> Snapshot 2
+> ast
 
  [
   {
@@ -123,7 +123,7 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 3
+> parsed
 
  [
   {
@@ -142,6 +142,6 @@ Generated by [AVA](https://avajs.dev).
   },
  ]
 
-> Snapshot 4
+> result
 
  '![abc](data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXMtYXNjaWkiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiBjb250ZW50U3R5bGVUeXBlPSJ0ZXh0L2NzcyIgaGVpZ2h0PSIxMDVweCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSIgc3R5bGU9IndpZHRoOjY4cHg7aGVpZ2h0OjEwNXB4O2JhY2tncm91bmQ6I0ZGRkZGRjsiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDY4IDEwNSIgd2lkdGg9IjY4cHgiIHpvb21BbmRQYW49Im1hZ25pZnkiPjxkZWZzLz48Zz48bGluZSBzdHlsZT0ic3Ryb2tlOiMxODE4MTg7c3Ryb2tlLXdpZHRoOjAuNTtzdHJva2UtZGFzaGFycmF5OjUuMCw1LjA7IiB4MT0iMTYiIHgyPSIxNiIgeTE9IjM2LjI5NjkiIHkyPSI3MC4yOTY5Ii8+PGxpbmUgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDowLjU7c3Ryb2tlLWRhc2hhcnJheTo1LjAsNS4wOyIgeDE9IjUwIiB4Mj0iNTAiIHkxPSIzNi4yOTY5IiB5Mj0iNzAuMjk2OSIvPjxyZWN0IGZpbGw9IiNFMkUyRjAiIGhlaWdodD0iMzAuMjk2OSIgcng9IjIuNSIgcnk9IjIuNSIgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDowLjU7IiB3aWR0aD0iMjMiIHg9IjUiIHk9IjUiLz48dGV4dCBmaWxsPSIjMDAwMDAwIiBmb250LWZhbWlseT0ic2Fucy1zZXJpZiIgZm9udC1zaXplPSIxNCIgbGVuZ3RoQWRqdXN0PSJzcGFjaW5nIiB0ZXh0TGVuZ3RoPSI5IiB4PSIxMiIgeT0iMjQuOTk1MSI+QTwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjIzIiB4PSI1IiB5PSI2OS4yOTY5Ii8+PHRleHQgZmlsbD0iIzAwMDAwMCIgZm9udC1mYW1pbHk9InNhbnMtc2VyaWYiIGZvbnQtc2l6ZT0iMTQiIGxlbmd0aEFkanVzdD0ic3BhY2luZyIgdGV4dExlbmd0aD0iOSIgeD0iMTIiIHk9Ijg5LjI5MiI+QTwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjI0IiB4PSIzOCIgeT0iNSIvPjx0ZXh0IGZpbGw9IiMwMDAwMDAiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXNpemU9IjE0IiBsZW5ndGhBZGp1c3Q9InNwYWNpbmciIHRleHRMZW5ndGg9IjEwIiB4PSI0NSIgeT0iMjQuOTk1MSI+QjwvdGV4dD48cmVjdCBmaWxsPSIjRTJFMkYwIiBoZWlnaHQ9IjMwLjI5NjkiIHJ4PSIyLjUiIHJ5PSIyLjUiIHN0eWxlPSJzdHJva2U6IzE4MTgxODtzdHJva2Utd2lkdGg6MC41OyIgd2lkdGg9IjI0IiB4PSIzOCIgeT0iNjkuMjk2OSIvPjx0ZXh0IGZpbGw9IiMwMDAwMDAiIGZvbnQtZmFtaWx5PSJzYW5zLXNlcmlmIiBmb250LXNpemU9IjE0IiBsZW5ndGhBZGp1c3Q9InNwYWNpbmciIHRleHRMZW5ndGg9IjEwIiB4PSI0NSIgeT0iODkuMjkyIj5CPC90ZXh0Pjxwb2x5Z29uIGZpbGw9IiMxODE4MTgiIHBvaW50cz0iMzgsNDguMjk2OSw0OCw1Mi4yOTY5LDM4LDU2LjI5NjksNDIsNTIuMjk2OSIgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDoxLjA7Ii8+PGxpbmUgc3R5bGU9InN0cm9rZTojMTgxODE4O3N0cm9rZS13aWR0aDoxLjA7c3Ryb2tlLWRhc2hhcnJheToyLjAsMi4wOyIgeDE9IjE2LjUiIHgyPSI0NCIgeTE9IjUyLjI5NjkiIHkyPSI1Mi4yOTY5Ii8+PCEtLVNSQz1bU3JKR3JSTEpTMDgwXS0tPjwvZz48L3N2Zz4=)'
diff --git a/test/snapshots/base.mjs.snap b/test/snapshots/base.mjs.snap