Custom renderer in marked.use() not applied to inline tokens

[The-LukeZ]

Marked version: 17.0.1

Describe the bug
Custom renderer methods are not being applied to inline tokens in paragraphs when using marked.use() with extensions.
I don't know if that happens, when extensions are registered globally via marked.use(), the custom renderer passed to the marked() function call does not override the rendering of tokens produced by those extensions during inline parsing within block-level contexts (e.g., paragraphs).

To Reproduce

Repl Code

import { marked, Renderer } from "marked";

class CustomRenderer extends Renderer {
  codespan({ text }) {
    return `<custom-code>${text}</custom-code>`;
  }
}

marked.use({
  renderer: new CustomRenderer(),
});

const input = "**Bold** - Use `**text**`";
const output = marked(input);

console.log(output);
// Expected: <p><strong>Bold</strong> - Use <custom-code>**text**</custom-code></p>
// Actual: <p><strong>Bold</strong> - Use <code>**text**</code></p>

Expected behavior
The custom renderer passed to marked.use({ renderer: new CustomRenderer() }) should be used for rendering all inline tokens, including codespan.

Additional context
I assume the issue occurs because the paragraph's inline token parsing does not receive or respect the custom renderer instance set in the marked.use() call, instead falling back to the default renderer.

The solution is to pass it with every marked() call instead of in .use(): marked(message, { renderer: new CustomRenderer() })

[UziTech]

The renderer property in use is not an object that extends Renderer, but an object with renderer properties that will override the default renderer functions.

The distinction is a little confusing but it allows multiple extensions to override different renderer functions.

Passing the extended renderer to marked.parse is available for backwards compatibility.

Try:

import { marked, Renderer } from "marked";

const customRenderer = {
  codespan({ text }) {
    return `<custom-code>${text}</custom-code>`;
  }
}

marked.use({
  renderer: customRenderer,
});

const input = "**Bold** - Use `**text**`";
const output = marked(input);

console.log(output);

[The-LukeZ]

Oh damn, I will try later 👍

[The-LukeZ]

Okay so it works now but instead the parsing of nested lists doesn't 😅
It throws an error token of type "list item" not found

https://github.com/supportmailapp/dashboard/blob/main/src%2Flib%2Futils%2Fmarkup.ts#L424-L432

Do I have a logic issue somewhere in the renderer object?

I changed a plan and now want to mostly use the integrated renderer logic but I need to restrict stuff like max heading depth and disable tables and more... 😅

[UziTech]

Can you provide markdown that fails with your extensions?

I tried a simple nested list (- - test) and it didn't throw an error.

[The-LukeZ]

- nested
  - list
  - example

Please note that I changed my logic and remove custom renderers for everything 😅
The version is available here: https://github.com/supportmailapp/dashboard/blob/3a39f80f2667f4505c0a805205957bfd32478b76/src/lib/utils/markup.ts

[UziTech]

You are using parseInline in listitem but list is a block token

https://github.com/supportmailapp/dashboard/blob/3a39f80f2667f4505c0a805205957bfd32478b76/src/lib/utils/markup.ts#L431