Cannot read property 'parent' of undefined (react-native) about link-preview-js

[bockc]

After testing stuff a little bit more, I changed the require from cheerio-without-node-native to cheerio, unfortunately the error still remains.

But I found out that if you try cheerio.load(body) when body is undefined, this is what causes the issue. By simply doing cheerio.load(body || '') I managed to get this answer:

contentType: "text/html; charset=ISO-8859-1"
description: undefined
favicons: ["https://www.google.com/favicon.ico"]
images: []
mediaType: "website"
siteName: undefined
title: ""
url: "https://www.google.com/"
videos: []
__proto__: Object

It's better but there are still issues, I'm missing a few data (description, siteName, title,....)
Will keep you posted if I find a fix, but I would appreciate some feedback on my findings :)

UPDATE:
By testing with another link (https://www.reddit.com), I get this result:

contentType: "text/html; charset=utf-8"
description: "Reddit is a network of communities based on people's interests. Find communities you're interested in, and become part of an online community!"
favicons: (13) ["https://www.redditstatic.com/desktop2x/img/favicon/android-icon-192x192.png", "https://www.redditstatic.com/desktop2x/img/favicon/favicon-32x32.png", "https://www.redditstatic.com/desktop2x/img/favicon/favicon-96x96.png", "https://www.redditstatic.com/desktop2x/img/favicon/favicon-16x16.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-57x57.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-60x60.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-72x72.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-76x76.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-114x114.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-120x120.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-144x144.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-152x152.png", "https://www.redditstatic.com/desktop2x/img/favicon/apple-icon-180x180.png"]
images: ["https://www.redditstatic.com/icon.png"]
mediaType: "website"
siteName: "reddit"
title: "reddit"
url: "https://www.reddit.com/"

This means the description and everything works fine for Google, and to be sure I compared with the preview that Facebook's Messenger displays and there's no description etc.
Unfortunately by doing the same to compare for the Reddit link, it looks like the title isn't good. Messenger displays reddit: the front page of the internet which is the title you see in your browser tab but in the response I get from your package, I only get reddit.
Any idea of what could be causing this ?

[ospfranco]

Let's go by parts:

1. You cannot replace cheerio-without-node for cheerio, because as the name suggest cheerio requires node libraries which are not available on RN.
2. As you can see you can get responses from other sites just fine, I also tested again on the simulator and it's working, this clearly is some limitation on cheerio's side when parsing non valid HTML, which apparently is the case for https://www.google.com but other links however are working just fine, unfortunately work on cheerio-without-node has stopped, I might replace it if I find a suitable alternative but this seems like an error on the site page rather than on this library, I will however catch the error, since that doesn't seem to be working atm.
3. The title is being parsed by the following function:

const getTitle = function (doc) {
  var title = doc("meta[property='og:title']").attr('content');

  if (!title) {
    title = doc('title').text();
  }

  return title;
};

I don't know how other apps/libraries parse it, but this is the way this library does it, what the sites put in those fields it's up to the sites, not me.

Thanks for noticing the bug!

[ospfranco]

I've updated/re-written the library in typescript, the error is now correctly being thrown when there is a parsing error, I cannot do anything to fix google.com though, let me know if you have any other question.

[bockc]

Just so you know, you can use node libraries in RN by using rn-nodeify. Not ideal, but if you got not other choice this is the way to go.

[bockc]

@ospfranco
Also, I tried with your new version (2.0.0) and the error is well caught.

But do you think you could use rn-nodeify to make cheerio work instead of cheerio-without-node-native just like I did ?
This would allow you to do cheerio.load(body || '') and ensure we can still get basic informations from the text response, like for instance the site picture etc.

[ospfranco]

If you look at the response you got, there are several fields missing, at the same time, this library is not RN only, adding nodeify to it might break stuff for node environments and increase the package size.

So that being said, I don't really see the benefit of doing this, in order to fix a single broken HTML document, google will probably publish a new version in no time and then the change is for nothing, happened with youtube a year ago and problem went away on its own.

[ospfranco]

however if you feel strongly about it, you can create a PR, test it, I'll review it and potentially merge it.

[bockc]

If you look at the response you got, there are several fields missing, at the same time, this library is not RN only, adding nodeify to it might break stuff for node environments and increase the package size.

So that being said, I don't really see the benefit of doing this, in order to fix a single broken HTML document, google will probably publish a new version in no time and then the change is for nothing, happened with youtube a year ago and problem went away on its own.

You're right, it was a stupid question.
Great work anyway :)

[canpoyrazoglu]

I've literally lost hours, trying to use google.com as my example domain, which I've learned that isn't working right now. Maybe a warning about trying with some other domain than google.com would be helpful.