Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Not selecting code block language makes crepe.getMarkdown() throw due to new blockLatexSchema #1640

Open
2 tasks done
VoloBuilds opened this issue Jan 23, 2025 · 0 comments · May be fixed by #1642
Open
2 tasks done
Assignees
Labels
bug Something isn't working

Comments

@VoloBuilds
Copy link

Initial checklist

  • I agree to follow the code of conduct
  • I searched issues and discussions and couldn’t find anything (or linked relevant results below)

Affected packages and versions

v7.6.1

Link to runnable example

https://crepe-editor-bug-simulator.lovable.app/

Steps to reproduce

  1. Install:
    "@milkdown/crepe": "7.6.1"
    "@milkdown/utils": "7.6.1"
  2. Create Crepe editor
  3. Create a code block and do not specify the language
  4. Attempt to call crepe.getMarkdown()

See link for demo (check console log - it points to the new change intended to support latex)
https://crepe-editor-bug-simulator.lovable.app/

Code running that demo:

import { useEffect, useRef } from "react";
import { Crepe } from '@milkdown/crepe';
import { replaceAll, getMarkdown } from '@milkdown/utils';
import "@milkdown/crepe/theme/common/style.css";
import "@milkdown/crepe/theme/frame.css";

export function Editor() {
  const editorRef = useRef<Crepe | null>(null);
  const containerRef = useRef<HTMLDivElement>(null);

  useEffect(() => {
    if (!containerRef.current || editorRef.current) return;

    const crepe = new Crepe({
      root: containerRef.current,
    });

    crepe.create().then(() => {
      editorRef.current = crepe;
      
      // Set some initial content with a code block
      crepe.editor.action(replaceAll(`# Test

\`\`\`
console.log('hello')
\`\`\`
`));
      
      // Try to get markdown content - this will throw if code block has no language
      try {
        const content = crepe.editor.action(getMarkdown());
        console.log('Content:', content);
      } catch (e) {
        console.error('Error getting markdown:', e);
      }
    });

    return () => {
      editorRef.current?.destroy();
    };
  }, []);

  return (
    <div className="h-full flex-1 flex flex-col">
      <div ref={containerRef} className="flex-1 pl-8 p-4 editor-pane" />
    </div>
  );
}

Btw, if you do select a language, it works without any issues. So this is specific to having no language selected in a code block and trying to getMarkdown().

Expected behavior

getMarkdown() should return the markdown despite no language being selected in the code block.

Actual behavior

getMarkdown() throws error in console and does not return the current markdown

Seems directly related to new code for v7.6.1:
18db4dc

Image
Image

Potentially easy fix just to change
if (language.toLowerCase() === 'latex') {
to:
if (language?.toLowerCase() === 'latex') {
(but I'm not familiar enough to be certain)

Btw, thank you for this incredible project!

Runtime

Chrome

OS

Windows

Build and bundle tools

Vite

@VoloBuilds VoloBuilds added the bug Something isn't working label Jan 23, 2025
@Saul-Mirone Saul-Mirone linked a pull request Jan 24, 2025 that will close this issue
2 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants