Develop Reference

Algolia and WordPress search page suddenly not working, console showing "Uncaught typeError"

I built a search page with WordPress & Algolia Search, and it's been working fine for a few months, but suddenly, I am getting the following error:
Uncaught TypeError: Cannot read property 'matchedWords' of undefined
The facet filters are no longer working and the search results are not being displayed.
Page in question is: https://habyts.com/activities-for-kids
I can't pinpoint anything having changed since it stopped working, so I don't really know how to fix this error.
The Algolia WordPress plugin has been updated a few days ago to 2.3.0, but I loaded the search page a few times after the update and it was working, it's only a day or so after the update that it broke and started showing the console error.
Please help!
Thanks in advance.

The Uncaught TypeError: Cannot read property 'matchedWords' of undefined error is raised because there is a field that no longer is present in your Algolia index.
From version 1.x to 2.x of the plugin, there have beens some changes and we have already seen this error once.
To solve it, you need to manually delete all the indices from your Algolia dashboard, and then trigger re-indexing of all the indices from the admin of the Algolia plugin.
In case you also did customize the autocomplete/search page template, you would need to make sure the fields used in those are still available in the data sent to Algolia.

I deleted all my Algolia Indices, and reindexed everything required, and reverted back to my old instantsearch hit template, which indeed worked again, with search highlighting working again.
One thing doesn't work though. I was previously using data.images.medium to display thumbnails of each search result. For some reason this no longer works, as in no image is displayed. There are no console errors present and I can't figure out what's changed.
I can get data.images.thumbnail working to display a thumbnail with each search result. I want however to grab a higher resolution image, which I was previously able to do using data.images.medium...
Any ideas?

I found out the answer from this post - https://discourse.algolia.com/t/image-size-on-instantsearch-page/1593/2
Since version 2.x, all image sizes are not returned with each search since it incurs performance issues.
To return custom image sizes other than thumbnails this code needs to be added to a plugin / functions file.
add_filter('algolia_post_images_sizes', function($sizes) {
$sizes[] = 'medium';
return $sizes;
});
Once this code has been added to functions or your own custom plugin file, you'll need to reindex everything and then your chosen custom image sizes should start to work.
Hopefully this is helpful.

Critical Error: Object doesn't support this property or method addeventlistener

actually I have a really weird problem, that I have been trying to solve for two weeks.
to begin with, I am using sharePoint 2010. we created two dashboards that fetch information from lists and then display them in a graphical form, simply the javaScript script using AJAX get the list and then use the information. its worth mentioning that I am using Jquery
here is a picture of what I am talking about:
lets say this is dashboard1
is working like a charm in all browser even internet explorer
the problem is with another dashboard, dashboard2,
the problem with dashboard2 is that, a jquery problem as I copied from the console:
Critical Error: Object doesn't support this property or method addeventlistener
to get what I mean, the navigation bars on the right get its html from the list that I fetch and I use jquery and bootstrab for collapse , this is how the not working page looks like:
the navigation bar doesn't get its items, the graphs don't load
I have tried this fix but it didn't work.
what I suspected is that, this problem is related to sharePoint somehow,let me tell you what else I have tried, I made another copy of the index.html which is the main index page for dashboard1 the working dashboard, and I called it test.html which has exactly the same code, its supposed to work right ? because this is just a copy of the index.html that is working in internet explorer and all browsers, but surprisingly it didn't work and I got the same error that I got when I run the other index2.html the one for the other dashboard (dashboard2).
what can cause this problem? and fixes can I try? Its nothing related to the code ( I can share the code if you want) but its a bug related to sharepoint or Microsoft explorer or both !
Critical Error: Object doesn't support this property or method addeventlistener

FancyBox Jquery Null Error - Strange issue

I am experiencing a very strange issue i am hoping someone can answer (its kind of broad, but i will explain it my best), code works on local page when opened, but as soon as the same page is uploaded it throws an error. Two others have also looked at this, resulting in more confusion.
I downloaded FancyBox to use the inline feature to pop up a user form via href link, instead of taking the user to an additional page.
You can see the "stock" fancy box here:
1 fancyapps.com/fancybox/demo
Under various options, Inline is what i am using.
I didnt need all of the other features that came with FancyBox so i stripped the page to the following, which works just fine:
2 *Fancy Box Demo Stripped to Inline Feature only*
So then, i applied this code to our sandbox copy of the page to implement:
3 *Sandbox Copy with Fancy Box inline feature added to "make offer" link*
It stops working! There are no conflicts with other javascript on the page, and the only difference is that it has a couple of color .css changes, all .fancybox was named to .ptroffer and that the css code is not inline on the page (which wouldn't cause this error anyway).
This same page, opened locally works beautifully - upload and it throws error.
SCRIPT5007: Unable to get value of the property 'ptroffer': object is null or undefined
<script type="text/javascript">
$(document).ready(function() {
$('.ptroffer').ptroffer();
});
</script>
Works fine with link #2, and with link #3 locally, but with #3 uploaded it throws error.
Please!

Something in your code somewhere is overriding $. If you change that "ready" handler to call
jQuery('.ptroffer').ptroffer();
you won't get that error. However, things may not work; I think that an older version of jQuery is being imported by something (1.3!), which is bad.
edit oh I see, something's pulling in Prototype. You've got a regular script soup going on there, and things are going to be unpredictable and bizarre until you get that straightened out. Probably somewhere in there something's calling jQuery.noConflict(), but that "ready" handler you're adding isn't written to expect that. Whatever code that's expecting jQuery 1.3 may be in for a surprise also.

google +1 button not working

I have a very complex site with 11 js files included on each page.
I have recently added the google +1 button, with the following code:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>
This displays the +1 button correctly until I click on it. When I click it, I get this error: https://support.google.com/plus/bin/answer.py?hl=en&p=plusone_button_error&answer=1199142
I have gone through the suggestions, and none are relevant in this case. I created a test page with only the above code in it and uploaded it to the same server. The test page works perfectly.
I'm assuming there is a js code conflict somewhere but I don't know how to debug it. Chrome and IE don't throw up any errors.

I got the same error here. I found that the page is taking too long to load and because of that the button could not work.
I commented some piece of code and page loaded faster than before and the button worked.

Could not complete the operation due to error 80020101 in IE

I am using jQuery 1.7.2 and lighbox in my website.
The HTML code which I want to load in lightbox is following:
//script type="text/javascript">
//jquery code
</script>
//html code..
While using firefox and chrome there is no problem while opening lightbox,
but while using IE it is displaying following error:
SCRIPT257: Could not complete the operation due to error 80020101.
jquery.min.js, line 2 character 11497..
When I change script type from text/javascript to text/html, lightbox opens fine but now javascript code doesn't work...

I have encountered this issue, as well. I have been using jQuery 1.7.2 and I am unable to get past this.
A solution was posted as being implemented in jQ 1.8.2, but that did not affect my results.
I changed my character encoding to UTF-8 (another suggestion I encountered), but that also did not help.
Eventually I rolled back to jQ 1.4.2 (the next previous version stored locally) and the problem went away. I know this isn't a "solution" but it's a workaround that got me back in the game and moving towards a deployable EAR.

You have a Javascript code that can't be correctly evaluated. I had exactly the same scenario and the solution was to change the name of an associative array key from class to "class" (this is only one example of evaluation error).
For more details, please see this answer