Overriding a JS file

Hello Team,
We have a requirement where we have to override the grid.js and list.js from the webshop and do the necessary changes.

How to override the js files from webshop to the custom app.

Path:
webshop/webshop/public/js/product_ui/grid.js
webshop/webshop/public/js/product_ui/list.js

https://frappeframework.com/docs/user/en/python-api/hooks

Refer hooks

Thanks for the reply

We are aware of frappe js file overriding
But the concern is regarding webshop js file

Any lead or update on overriding the JS file from webshop application

@NCP

check the reference:

1 Like

Hi,
I am also trying to override views.js
i have created the
class CustomWebshopProductView extends webshop.ProductView and at the end of the file webshop.ProductView = new CustomWebshopProductView;
i loaded on hoooks web_include_js = “web-js.bundle.js”

After all i get this error: Class extends value undefined is not a constructor or null

What am i doing wrong or not doing well ?

Thanks in advance

I am also having the same troubles as you - I wish to override “views.js”.

Did you end up resolving this? If so, how?

Thanks for your time!

Hi,

Did long ago…

on my web-js.bundle.js i have those:

import ‘../../customizations/init’;

import ‘../../customizations/customer_reviews’;

import “./product_ui/views.js”;

import “./product_ui/grid.js”;

import “./product_ui/list.js”;

import “./product_ui/search.js”;

import ‘./shopping_cart’;

import ‘./wishlist’;

import “./website_utils.js”;

import “../../templates/includes/macros.html”

You might not need all… under public/js created directory product_ui and copied the files grid.js, list.js, search.js and views.js (made my changes on this one).

in Hooks.py i have added:

web_include_js = [“web-js.bundle.js”]

Hope it helps.

Overriding JS files can be a bit of a headache if you aren’t careful with the hooks. It is usually best to ensure your custom script loads after the core file to avoid any unexpected conflicts during system updates later.