Fixed syntax errors coming from prismjs

[acelyavul]

Hello,

This is related to the this issue Logs appears in debugging mode.

Note: Also there are some vulnerabilities that can be fixed with npm audit.

Could you please review?

[chrisglein]

I've been hitting #12 and looking for a fix. Found your PR linked from the issue. This PR has a bunch of whitespace/reformatting changes that are distracting from the actual fix (and probably making it less likely the repo maintainer is going to look at the PR). Is this the meaningful part of your change:

index.js

import "./prism-config.js";

prism-config.js

global.self = global;
self.Prism = { disableWorkerMessageHandler: true };

Is there more? Looks like the same solution suggested here: https://github.com/PrismJS/prism/issues/1303#issuecomment-922946233

[chrisglein]

I've applied just the above locally and confirmed it works to suppress the messages. With one edit: no need to assign global.self.

prism-config.js

global.Prism = { disableWorkerMessageHandler: true };

[acelyavul]

I've been hitting #12 and looking for a fix. Found your PR linked from the issue. This PR has a bunch of whitespace/reformatting changes that are distracting from the actual fix (and probably making it less likely the repo maintainer is going to look at the PR). Is this the meaningful part of your change:

index.js

import "./prism-config.js";

prism-config.js

global.self = global;
self.Prism = { disableWorkerMessageHandler: true };

Is there more? Looks like the same solution suggested here: PrismJS/prism#1303 (comment)

Yes, you're right :/ and this was all I changed

[chrisglein]

Yes, you're right :/ and this was all I changed

Created a PR that applies the minimal change: https://github.com/conorhastings/react-native-syntax-highlighter/pull/34

[KonstantinZhukovskij]

It didn't help me. I still get an error. Are you sure it works?

[acelyavul]

It didn't help me. I still get an error. Are you sure it works?

global.self = global;
global.Prism = { disableWorkerMessageHandler: true };

Hi, it worked for me JSON syntax error in debugging mode as above. And also in jest, it was throwing an error.

[KonstantinZhukovskij]

It didn't help me. I still get an error. Are you sure it works?

global.self = global;
global.Prism = { disableWorkerMessageHandler: true };

Hi, it worked for me JSON syntax error in debugging mode as above. And also in jest, it was throwing an error.

I didn't understand what you mean. The code given is throwing an debug error.

[acelyavul]

It didn't help me. I still get an error. Are you sure it works?

global.self = global;
global.Prism = { disableWorkerMessageHandler: true };

Hi, it worked for me JSON syntax error in debugging mode as above. And also in jest, it was throwing an error.

I didn't understand what you mean. The code given is throwing an debug error.

Are we talking about the same error? This was coming from prism.

[KonstantinZhukovskij]

yes

[chrisglein]

yes

Did you apply the whole change or just add those lines to your project? If you read up on the thread for the issue you'll see it noted that the import order is very important, which is why those lines are put into a separate file to get imports to work.

[KonstantinZhukovskij]

I'll add screenshots as proof)

[acelyavul]

@KonstantinZhukovskij you're altering the module itself but dist file doesn't have the changes you made. You can put the src folder inside your app and add react-syntax-highlighter as dependecy. But you are going to have import error, you need to change them.

import React from 'react';
import { Text, ScrollView, Platform } from 'react-native';
import './prism-config.js';

import SyntaxHighlighter from 'react-syntax-highlighter';
import SyntaxHighlighterPrism from 'react-syntax-highlighter/src/prism';
import { createStyleObject } from 'react-syntax-highlighter/src/create-element';
import { defaultStyle } from 'react-syntax-highlighter/src/styles/hljs';
import { prism as prismDefaultStyle } from 'react-syntax-highlighter/src/styles/prism';

This should work.