Calendar not working - TypeError: Cannot set property 'innerHTML' of null

[itsdanielfelix]

Hi,

I created my personal site ( https://danielfelix.in/ ) a few weeks back and used Bloggify/github-calendar to display my GitHub Contributions on it.

It was working fine as of last week.

And when I checked today it didn't display anything, so I checked the console and found the following error.

TypeError: Cannot set property 'innerHTML' of null

I even created a CodePen to test it and have received the same error on its console as well.

Any fixes to this issue?

Thanks in advance...

[kristofgilicze]

Seems to me that Github changed the HTML markup slightly, making this DOM query fail:

cal.querySelector(".float-left.text-gray").innerHTML = options.summary_text;

[vladrunk]

If add a comma in this part of the code e.querySelector(".float-left.text-gray").innerHTML between classes .float-left и .text-gray => e.querySelector(".float-left,.text-gray").innerHTML a 'skeleton' appears, but no account information.

[Cipher-Coder]

There are actually a few things going on here... GitHub has once again, changed the way that their commit graph SVG renders. That has thrown off the github-parser library that that this repo is relying on to actually parse the SVG.
I have forked all the repos and am working on it. So far, I've got the graph to render again. I was able to then style that with some CSS just using the [data-level='0'] attributes. @kristofgilicze you were correct in that when I took out the .text-gray the graph began to render again. Though it is all in black. You can style it with CSS. Like I said, targeting the [data-level='0']

cal.querySelector(".float-left").innerHTML = options.summary_text;

I then had to re-style the 'Summary of Pull Request...' line that it was attempting to apply at the bottom.

Now, I am starting to work on the streaks. We had trouble with this not too long ago. GitHub changed the attribute naming and everything on the SVG which is what the parsing lib is trying to pick up on. I would have to look back at previous versions to see how @IonicaBizau fixed it last time. Although I think there has been a few different things over the past few months.

I got to here so far:

I am still working on it. I will let you know if I come up with anything else.

[Cipher-Coder]

In all the SVG's that GitHub has used to show the contributions graph, there has always been a 'fill' attribute. The current SVG that GitHub is using does not contain one and the github-parser library depends on that attribute:

if (!fill) {
            return;
        }

Without it, as you can see, it is doing what it was told. Returning nothing. I did get mine up and running again.

I stripped out a bunch of things I did not need, including that if statement. I use my own styling so the 'fill' is not important to me. I took a lot of things out that I did not need so I am not sure if you would be able to use it. I also hard coded my own proxy and some other things. You are welcome to check my fork out to give yourselves some ideas. I have browser extensions relying on this, which is why I forked it to begin with and also why I am always in a mad dash to get things working again.
This is my fork of the github-parsing library and also my fork of the github-calendar repo.
I hope this gives you all some ideas. And hopefully this will make things easier on @IonicaBizau to fix it.

If you have any other questions that I may be able to help with... Hit me up.

[Ariel-MN]

Thank you so much @IonicaBizau, you are the best.