Possible to override Query Report js class?

I’m trying to extend the Query Report js class with some additional controls, I have it mostly working with composition but refreshing and reloading isn’t quite working properly. I really need to override some class methods using inheritance, but I’m struggling to replace the query-report object with my own. I’ve tried the below in my report js file (after declaring the extended class) but it doesn’t call my show() I suspect because the query_report.js content is loaded later. Any ideas please?

frappe.standard_pages['query-report'] = function() {
	const wrapper = frappe.container.add_page('query-report');

	frappe.ui.make_app_page({
		parent: wrapper,
		title: __('Query Report'),
		single_column: true,
	});

	frappe.query_report = new TaxDetail({   <-- extends QueryReport
		parent: wrapper,
	});

	$(wrapper).bind('show', function() {
		frappe.query_report.show();
	});
};

frappe.standard_pages['query-report']();
1 Like

I had to monkey-patch the QueryReport class, it works nicely:

erpnext.TaxDetail = class TaxDetail {
	constructor() {
		this.patch();
		this.load_report();
	}
	// Monkey patch the QueryReport class
	patch() {
		this.qr = frappe.query_report;
		this.super = {
			refresh_report: this.qr.refresh_report,
			show_footer_message: this.qr.show_footer_message
		}
		this.qr.refresh_report = () => this.refresh_report();
		this.qr.show_footer_message = () => this.show_footer_message();
	}
	show_footer_message() {
		this.super.show_footer_message.apply(this.qr);
...
3 Likes

Hey @casesolved-co-uk Could you please elaborate a little more.

I’m trying to override the query_report.js file to create a common custom button for all reports

You need to read about monkey patching and then do your research until the above code makes sense. It’s all there.

Essentially what the above code does is save off references to existing framework methods so they can be called later and then replace them with local ones with additional functionality.

Use as a last resort. If you’re adding long-term functionality you should look at adding a hook into the framework.