#community-help

Resolve Prototype.js Interference With Typesense/InstantSearch Implementation

TLDR John reported an error after including Prototype.js library in their website, affecting the Typesense/InstantSearch implementation. Nick suggested avoiding the old library, but John couldn't due to it being required by Magento 1.9. Jason clarified the issue and suggested an upgrade. Upgrading to Prototype.js version 7.1 mitigated the issue according to John.

32mo

Join the chat

May 26, 2021 (32 months ago)

Photo of md5-7a0ab48aa8979a59e1d8c3919797c1f8

John

04:49 PM

My website uses the prototype.js library - see http://prototypejs.org/

And as soon as I include this library it kills the Typesense/InstantSearch implementation, giving the error I pasted below.

Does anyone know how I could resolve this?

uniq.ts:2 Uncaught TypeError: Cannot read property 'indexOf' of undefined
    at uniq.ts:2
    at prototype.js:884
    at prototype.js:825
    at Array.forEach (<anonymous>)
    at Array.each (prototype.js:824)
    at Array.findAll (prototype.js:883)
    at le (uniq.ts:2)
    at prepareTemplateProps.ts:26
    at he (prepareTemplateProps.ts:60)
    at hits.tsx:42

Photo of md5-c816eda2a7af563aa54f2ae668f3a619

Nick

05:11 PM

Oof, that's an old library. My instinct says it may have something to do with the fact that prototype messes with a lot of built in types. If you are starting a new project it may be worth considering dropping prototype, as everything it offers can be done in vanilla js by now. If it's a legacy website, could you set up a minimal reproducible example somewhere, eg codepen or GitHub?

John

10:27 PM

I won't be able to remove prototype.js easily... The site I am talking about runs under Magento 1.9, which depends on prototype.js unfortunately...

Photo of md5-8813087cccc512313602b6d9f9ece19f

Jason

11:02 PM

John I just dug through that stack trace and I can confirm what Nick mentioned above is indeed the issue.

Instantsearch.js uses the Array.filter function and the modern JS implementation of it takes 3 parameters.

However, Prototype.js redefines Array.filter
globally as it's own 2-argument function and that causes InstantSearch.js to error out.

Not sure if this is helpful, but may be something like this might help prevent prototype polluting the global Array object: http://perrymitchell.net/article/stop-polluting-my-prototypes/

John

11:15 PM

Thanks Jason, very cool link! Now, my website was using prototype.js version 7.0. And upgrading to 7.1 resolved the issue (for now, since I haven't finished my implementation...)

Jason

11:19 PM

Oh awesome!

Typesense

Lightning-fast, open source search engine for everyone | Knowledge Base powered by Struct.AI

Indexed 3015 threads (79% resolved)

Join Our Community

Similar Threads

Resolving Typesense Setup Issues with VueJS

A sought help with setting up Typesense in a CDN VueJS application. Jason guided him to adjust the initialization and provided a solution to an undefined item warning, resulting in a successful setup.

31mo

Contributing to project using JS, TS, Go and PHP

Matthew volunteered to contribute to the project using JavaScript, Typescript, Go, and PHP. Jason assigned two tasks, including Laravel integration and nest.js library. hi019 encouraged Matthew to try out the Laravel integration.

29mo

Troubleshooting TypeScript Error with Typesense

GM experienced an error with Typesense in TypeScript, requiring help to correct the issues. Jason helped propose solutions and adjustments to the code. Ultimately, they were able to resolve the errors and successfully implement a search function.

14mo