search

PrismJS / prism

Lightweight, robust, elegant syntax highlighting.
https://prismjs.com
MIT License
12.28k stars 1.3k forks source link

WebPlatform Docs throws JS error #144

Closed ifdattic closed 10 years ago

ifdattic commented 11 years ago

While working with Prism I noticed it throws a JS error. After a bit of tinkering here is what I have:

  1. It happens when WebPlatform Docs plugin is added.
  2. The JS error that is thrown: https://dl.dropboxusercontent.com/u/18389424/prismjswpderror.png
TypeError: pattern.exec is not a function
http://localhost/projects/prism/assets/195f76cb/prism.js
Line 222
  1. The JS used is default theme, all languages and all plugins on 2013-07-28. For simplicity the link to unminified JS file https://dl.dropboxusercontent.com/u/18389424/prism.js
  2. In only happens for CSS code blocks. HTML works, and even SCSS works (just with wrong links).

Hope this helps.

hiulit commented 10 years ago

Same here!

When using WebPlatform Docs plugin you can no longer use language-css as @ifdattic stated. You have to use language-scss when targeting css code blocks.

I had to tweak the plugin in a lame (and hardcoded) way to add support for scss code blocks, like so: if (env.language == 'css' || env.language == 'scss')

But this doesn't change the fact that there's something there throwing an error when using css code blocks.

Cheers.

apfelbox commented 10 years ago

Do you have a test case? I currently can't reproduce the issue.

hiulit commented 10 years ago

Actually I don't. All I did was download Prism and then start adding plugins to it until I found WebPlatform was the one.

Do you want me to set up an example and share it with you?

apfelbox commented 10 years ago

Would be nice. I tried it with this code and didn't get an error:

<!doctype html>
<html lang="de">
    <head>
        <meta charset="UTF-8">
        <title>Prism Test</title>

        <link rel="stylesheet" href="/_Github/LeaVerou/prism/themes/prism.css" />
        <link rel="stylesheet" href="/_Github/LeaVerou/prism/plugins/wpd/prism-wpd.css" />
    </head>
    <body>

        <pre><code class="language-css"><?= file_get_contents("content.css") ?></code></pre>

        <script src="/_Github/LeaVerou/prism/components/prism-core.js"></script>
        <script src="/_Github/LeaVerou/prism/components/prism-css.js"></script>
        <script src="/_Github/LeaVerou/prism/plugins/wpd/prism-wpd.min.js"></script>
    </body>
</html>

(installed version: cc36c8567d7aa216114f4215c1e8c361a8420c79)

hiulit commented 10 years ago

I'll try make an example when I get home, right now I'm at work :P But let me tell you that I used the compiled JS you get from http://prismjs.com/download.html (Development version, Languages: All, Pugins: Autolinker, WebPlatform and File highlighter)

apfelbox commented 10 years ago

Aha! I can reproduce it now.

apfelbox commented 10 years ago

Ok, found the issue.

The wpd-plugin assumes, that Prism.languages.css.selector is just a regex, but if you load css-extras it is not just a regex anymore.

Patch should be trivial.

hiulit commented 10 years ago

Do you think you can fix it and submit a pull request @apfelbox ?

apfelbox commented 10 years ago

@hiulit done. @LeaVerou could you take a look and merge it, if everything is all right?

LeaVerou commented 10 years ago

Done! Closing this issue, feel free to reopen if the issue persists. Thanks again @apfelbox!