Markdown previewer 6 fails when deploy, works locally on my machine

Hi!
My markdown previewer works on my machine using the CDN in a typescript app:

type PreviewProps = {
  toPreview: string
}


export default function Preview({ toPreview }: PreviewProps) {
  window.marked.setOptions({
    renderer: new window.marked.Renderer(),
    breaks: true,
    sanitize: true,
  })
  let html = window.marked.parse(toPreview)

  return (
    <section
      className="
      flow-root
      bg-lightBlue
      rounded block
      m-10
      p-4
      flex 
      justify-center
      minHeight"
      id="preview"
      dangerouslySetInnerHTML={{ __html: html }}
    ></section>
  )
}

This is my default markdown

export const defaultMarkdown: string = `# header
## Link:
[visit google](https://www.google.com)
### An Image:
![the react way to render a list](https://d3n0h9tb65y8q.cloudfront.net/public_assets/assets/000/002/336/original/What_are_keys_in_React.png?1640091613)
Inline Code:
example of some \`npm i -S react react-dom\` inline code
### Code Block
*Typescript Code Example*
\`\`\`javascript
import React from 'react'
import Editor from './Editor'
import Preview from './Preview'
import './App.css'
import { useState } from 'react'
import { defaultMarkdown } from './markdown'

function App() {
  const [markdown, setMarkdown] = useState(defaultMarkdown)

  const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
    setMarkdown(event.target.value)
  }
  return (
    <div className="w-full text-center bg-blue py-20 min-h-screen">
      <h1 className="py-5 mb-4 text-4xl font-extrabold tracking-tight leading-none text-white md:text-5xl lg:text-6xl">
        Markdown Previewer
      </h1>
      <Editor handleMarkdown={(e) => handleChange(e)} markdown={markdown} />
      <Preview toPreview={markdown} />
    </div>
  )
}

export default App
\`\`\`

### List Item:
1. First item
2. Second item
3. Third item
4. Fourth item
### a Blockquote:
> Dorothy followed her through many of the beautiful rooms in her castle.
### bolded text:
Love**is**bold

Thanks for your help!

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

Thanks a lot Dan!
So somehow the first time I click on run tests, iit fails, but the second time they all pass. yeah!

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