How to customizing the native navigator.share() function?

I'm trying to modify the url parameter of the navigator.share() function so when some share the page using the mobile browser's share option, I'm able to customize the URL.

Why I need this? I have WordPress website www.abcwebsite.com that has a dynamic cloning system with subdomain with a single backend site (not multisite network, we use a plugin to manage identify the subdomain and modify certain texts). Ex: clonea.abcwebsite.com is an exact copy of the main site except for some text elements. For SEO purposes, we want to disable the clone sites from being indexed but want to capitalize on the traffic that the clone sites get.

The initial step I did was change the canonical meta tag to point to the root domain. Later I identified that navigator.share() by default uses the canonical link and if not found then falls back to location.href. When someone shared the clone page using browser's share option, it shares the main site link instead of the cloned link. Not a feasible solution.

Next step was to completely remove the meta tag for canonical and move it to http headers. It solved our problems with Google. But recently I have noticed that the canonical in the header doesn't work in Bing and so all the thousands of our clone sites are now appearing in Bing results.

I believe the only way to go about it add the canonical meta tag and point it to main website, and when navigator.share() is initiated by browser's share option, pass the clone site url into the share.

This is what I have tried and I get Maximum call stack size exceeded error--

var defaultNavigator = navigator;
function shareThis($args){ return defaultNavigator.share($args); }
navigator.share = function($args){ return shareThis($args); };
navigator.share({ url: "https://www.abcwebsite.com", text: "Test", title: document.title });

and with this I get Failed to execute 'share' on 'Navigator': Illegal invocation

var defaultShare = navigator.share;
function shareThis($args){ return defaultShare($args); }
navigator.share = function($args){ return shareThis($args); };
navigator.share({ url: "https://www.abcwebsite.com", text: "Test", title: document.title });

from How to customizing the native navigator.share() function?