Need some help with markdown previewer

I made my markdown previewer with the marked npm package, with the following code:

import React, {useState} from "react"
import {marked} from "marked"

import "./App.css"

marked.setOptions({
  renderer: new marked.Renderer(),
  gfm: true,
  tables: true,
  breaks: true,
  pedantic: false,
  sanitize: false,
  smartLists: true,
  smartypants: false
})

class App extends React.Component {
  constructor(props) {
    super(props)
    this.state = {
      input:  "# h1 \n## This is some markdown\n### Consider making your own\n\n#### List items\n- George\n- Paul\n- Ringo\n- John\n\n#### Make it **bold** or make it *italic*\n\n#### Create links [Github](https://github.com/andydlindsay)\n>a cool block quote\n ```code``` \n `inline code` \n ![Alt text](https://images.unsplash.com/photo-1682687220640-9d3b11ca30e5?ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1470&q=80 'a title')"

    }
    this.handleChange = this.handleChange.bind(this)
    this.getMarkdownText = this.getMarkdownText.bind(this)
  }

  handleChange(event) {
    this.setState({
      input: event.target.value
    })
  }
  getMarkdownText() {
    var rawMarkup = marked.parse(this.state.input)
    return {__html: rawMarkup}
  }
  render() {
    return (
      <div className="container-fluid mx-auto mt-4">
        <div className="mb-3">
          <textarea
            onChange={this.handleChange}
            value={this.state.input}
            className="form-control"
            id="editor"
            rows="3"
          ></textarea>
        </div>
        <div
          dangerouslySetInnerHTML={this.getMarkdownText()}
          id="preview"
        ></div>
      </div>
    )
  }
}

export default App

My code seems to meet all the user story requirements, and works fine for me when running it, everything works the defaults are set, etc.
However I get these two errors when running my app, even though the code markdown shows up perfectly fine.

5. write some markdown representing a codeblock, i.e. <pre><code>...</code></pre> : expected false to be true
AssertionError: write some markdown representing a codeblock, i.e. <pre><code>...</code></pre> : expected false to be true
6. #preview does not contain at least one <pre> : expected +0 to be at least 1
AssertionError: #preview does not contain at least one <pre> : expected +0 to be at least 1

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.