Images/GIFs & DropDown Not Displayed with HTML Syntax

[CRTejaswi]

OS: Windows 10 (Version 10.0.17134.228)
Browser: Firefox v71.0
Editor: Sublime: 3.2.2, Build 3211
Plugin: MarkdownPreview v2.2.5

---

I've been using the plugin for a long time now, but only recently, I've observed some issues in the HTML files generated by the plugin. Previously, to insert images in a markdown file, a syntax like

<p align="center">
    <img src="resources/flask.gif">
</p>

had no issues. Now, these images are not displayed in the generated HTML files. This is because, in th HTML files, file paths are not generated properly. [PREVIOUS]

<p align="center">
  <img src="///C://absolutePath/flask.gif">
</p>

[NOW]

<p align="center">
  <img src="C://absolutePath/flask.gif">
</p>

---

Similarly, a syntax like

<details>
<summary>v1</summary>

> CHANGES: CLI Version. <br>
- [x] Some Task.
/* codeblock */
</details>

previously had no issues generating this

v1

> CHANGES: CLI Version.
- [x] Some Task. ``` codeblock ```

Now, these are not displayed properly in the generated HTML files. This is because HTML content within <details>...</details> is not properly translated. Two common issues are:

• Not wrapping some tags within <p>...</p>.
• Any markdown syntax inside <details>...</details> is duplicated, instead of generating the appropriate html syntax.

[PREVIOUS]

<p><details>
<summary>v1</summary></p>
<blockquote>
<p>CHANGES: CLI Version. <br></p>
</blockquote>
<ul class="task-list">
<li class="task-list-item"><input type="checkbox" disabled checked/> Some Task.</li>
</ul>
/* content-for-codeblock */
</pre></div>
</details></p>

[NOW]

<details>
<summary>v1</summary>
> CHANGES: CLI Version. <br>
- [x] Some Task.
/* content-for-codeblock */
</pre></div>
</details>

I'm using the plugin with default configuration and am facing these issues. Kindly help me figure out how to resolve them.

[facelessuser]

1. I'm not certain what parser you are using (github, markdown)

2. This contains multiple issues, Each issue in the issue tracker should really contain one fully explained issue.

3. Detail behavior at one point changed in the Python Markdown dependency (an upstream package). Before the element was treated as an inline element, but in most recent versions it is treated as a block level element. This means markdown is not parsed inside it unless you use something like https://python-markdown.github.io/extensions/extra/#markdown-inside-html-blocks.

   You can enable just this behavior by using https://facelessuser.github.io/pymdown-extensions/extensions/extrarawhtml/ which exposes just this functionality.

So there is a lot here in this issue, please narrow the issue down to one thing that I have not answered. If you have other issues, please open separate issues. Each issue should contain things like related settings used to enable functionality code snippets for reproducibility and any other helpful info.

[facelessuser]

As for the images, the upstream package pymdown-extensions, which I'm the author of adjusted some logic related to paths. As you noted, in Firefox, images don't load if they are in the form c:/path/file.png, but they do load if /c:/path/file.png. In chrome the former and latter both load fine.

[facelessuser]

I may update the upstream package to simply ensure all absolute paths start with / moving forward. This check would only have an affect on Windws, and only when we are dealing with drives as network paths would always start with / (//blah/blah/path/file). You'll have to wait until I get the upstream package updated, but you could use Chrome for this purpose until then.

[facelessuser]

You can also change to settings to use relative paths as well as a temporary solution.

    "image_path_conversion": "relative",

@gir-bot add T: bug, S: confirmed @gir-bot lgtm

[facelessuser]

FYI, I am testing out a fix. When converting relative URLs to absolute, paths that do not start with / will have one added. This should fix the issue moving forward. I just need to confirm it doesn't add any unexpected side effects.

[facelessuser]

I should be making a new release of the required package . Once I do, I will update the Sublime dependency, at that point, this issue will be closed.

Sublime will update the dependency automatically, but if it does not, you may have to run Package Control's Satisfy dependency command.

I will close this issue once the new dependency is in place.

[CRTejaswi]

Thank you for taking out time to work on these issues. I couldn't respond earlier due to several commitments. I appreciate you responding to my queries.

[facelessuser]

The dependency has been updated. Ensure you have the latest dependency as described above in order to fix this issue.