Test Suite Not Working (the classic "Mocha Div Missing" issue)

Hey all,

I tried searching around for help with this issue for a while before deciding to post anything about it. I’m having the same issue that has been floating around- the test suite hasn’t been working, and I haven’t been able to find a solution to it. I’m using the latest version of Chrome.

Some of the things that I’ve tried:

-Forking the provided template doesn’t work. I started my project on a forked template, and have even tried to fork a new one and just move the code over to no avail. Not even blank forked templates will work.

-Having the or adding it to the JS external scripts makes no difference. I have tried both with and without the ‘mocha’ div added; no dice.

-Moving the tag around doesn’t work. Seeing some people suggest that its’ location in the code would make a difference (such as having it in the tag, or at the end of it, etc.)

-Adding codepen.io to the list of allowed third-party website cookies had worked before, but now doesn’t seem to do anything. Removing it and adding it back again did nothing, too. (When it was working previously I had to save+reload every time to get it to work, though; now that does nothing as well).

If anyone has any suggestions on how to fix it, I’d appreciate any help that can be offered.

Thanks in advance.

Can you provide a link to your pen?

I can, yes, but as I said it happens even with a perfectly blank, freshly forked pen, which makes me wonder that there is something else causing it.

https://codepen.io/Liimbo/pen/dybmxrv?editors=1010

I guess I am unclear what you mean by the test suite is “not working”. Do you see the test suite menu? If so, what actually happens when you select the JavaScript Calculator from the dropdown and click Run Tests? If you are not seeing the menu, then what exactly does your browser console show?

Yes, I see the test suite menu. I have used it in the past before- I tried mentioning this in the post- so I am familiar with how it works, usually. By “not working”, I specifically mean that when I use the dropdown menu and click on a test to run (such as the JavaScript Calculator test), instead of running the tests I would get the error about how the “#mocha div is missing”. Adding this div anywhere in my code will allow it to “run” in the sense that it will always show 0 tests being run, 0 tests being passed, and 0 tests being failed (so, not truly doing anything). I can provide a screenshot specifically showing how it shows up if necessary, but that is the best way that I can describe it.

Yes, it would be great to see a screenshot of the error you are seeing.

EDIT: I forked your project and moved the test suite cdn into the External scripts of the JavaScript settings section. Also, I got rid of Babel, since you do not need it.

Link: https://codepen.io/rmdawson/pen/LYPvRXR

Are you able to run the test suite now without an error?

Sorry for the late reply-

I tried running the link you provided, but I still receive the same error. I tried moving it into the external scripts before and it wouldn’t work; sorry if I forgot to mention that. I am providing two screenshots of my issue- the first is showing what happens when I run it without a ‘mocha’ div, the second is what happens when I add one. This error happens even if I run a completely blank, forked test suite, and happens if I have the scripts loaded externally or in a script tag.

Pictures: https://imgur.com/a/tm8jrTz

The images you show are not of the link I provided (https://codepen.io/rmdawson/pen/LYPvRXR). Also, I wanted to see a screenshot of the browser console to see if there are errors showing there too.

I know that they aren’t- I was trying to tell you that I receive the same error either way. You also did not mention that you would like to see the browser, so I can add that in this time as well.

Pictures: https://imgur.com/a/NAfFt5l

I still do not see the browser’s console in the last screenshot you uploaded.

My apologies; I’ve added it to the last links’ album.

Still do not see it. Can you not just press print srcn on your keyboard and use Ctrl+V to paste it into a reply?

EDIT: It finally showed up.

Whenever things are working as expected, I take a look to see if there are any errors showing in the browser console. Next, I google the error message and see what fix might be out there.

I’ve seen this mentioned on another thread, and I have added ‘codepen.io’ as an exception to being blocked as a third-party already. In my initial post, I said that this has previously (adding it as an exception) allowed the test suite to run, and that suddenly it now does not. Would there be a reason as to why the exception would stop working?

You will need to add more than codepen.io according to the error showing in the console.

Awesome; the addition of the cdpn.io and freecodecamp.org makes it work again. Thank you for taking the time to help me fix this issue.

I just had success adding the additional cdpn.io and freecodeacademy.org to my allowable cookies. Initially I only needed to add codepen.io. Not sure why it keeps changing in Chrome, but hope it stays for now.