Image (<img) tag is not rendered when using ReactMarkdown in react js

Finally I founded the solution.

I saw CORB error in console I research about why this was happening and founded that in readme file url of images were not correct.

The readme url were https://github.com/username/project/blob/master/Screenshots/s1.png && required Url was: https://raw.githubusercontent.com/username/project/master/screenshots/s1.png

So the problem was that when we set the src for the image, we need to use a URL which points to an actual image and first url was not pointing to actual image.

this was the root cause and because of this images were not rendering.

So I write code to convert all the urls of img tags only of markdown response. https://playcode.io/666242/ complete code.

// This function will find all the links in img tag.

function getImages(string) {
  const imgRex = /<img.*?src="(.*?)"[^>]+>/g;
  const images = [];
  let img;
  while ((img = imgRex.exec(string))) {
    images.push(img[1]);
  }
  return images;
}

// This function convert the markdown text. 

const convertImgInMarkdown = (markDown) => {
  let mark = markDown;
  let imageTags = getImages(mark);
  let updatedImages = [];
  imageTags.map((image) => {
    let xx = image.split(".com");
    let y = `https://raw.githubusercontent.com` + xx[1];
    let z = y.replace("/blob", "");
    updatedImages.push(z);
  });
  for (let i = 0; i < updatedImages.length; i++) {
    mark = mark.replace(imageTags[i], updatedImages[i]);
  }
  return mark;
};