The CreatorCon Call for Content is officially open! Get started here.

How to copy hyperlink to clipboard from UIB client script

Thulasidharan
ServiceNow Employee
ServiceNow Employee

Hello everyone,
            There is one functionality requirement where I need to copy the content to clipboard that is available in the component which contains link as well. So If I paste the copied content, it should show as hyperlink.

I found the function 'article action include' from 'ux_client_script_include' table to copy the content to clipboard. But it is not handling for the hyperlink things.

UIB Client script:

function handler({
    api,
    event,
    helpers,
    imports
}) {
    (async () => {
        try {
            var clipbordUtility = imports["sn_km_uib.Article actions include"]();
            var clipboard = clipbordUtility.getClipboard();
 
            var recommendationTitle = event.context.item.value.title;
            var recommendation = event.context.item.value.reason;
            var link = event.context.item.value.link;
 
            var subject = 'ServiceNow Impact recommendation: ' + `"${recommendationTitle}"`;
            var body = subject + '\n' + recommendation + '\n' + '<a href=' + `"${link}"` + '>Link</a>';
            body = renderHTML(body);
            var message = clipbordUtility.getTrimmedValue(body);
 
            await clipboard.writeText(body);
        } catch (e) {
            api.emit('NOW_UXF_PAGE#ADD_NOTIFICATIONS', {
                items: [{
                    icon: 'alert-circle-outline',
                    status: 'negative',
                    content: "Failed to copy to clipboard: " + e.message,
                    action: {
                        type: 'dismiss'
                    }
                }]
            });
        }
    })();

    function renderHTML(message) {
    let text = message;
    text = text.replace(/<\s*\/?\s*p\s*>/gi, '\n');
    text = text.replace(/<\s*br\s*\/?\s*>/gi, '\n');
    text = text.replace(/<(?!a\s+href|\/a>)[^>]+>/g, '');
    text = text.replace(/\n\s*\n/g, '\n\n');
    text = text.replace(/&#(\d+);/g, (_, code) => String.fromCharCode(code));
    text = text.split('\n').map(line => line.trim()).join('\n');
    return text.trim();
}
}


article action include:

function include() {
	return {
		getOrigin: function() {
			return location.origin;
		},
		getClipboard: function() {
			return navigator.clipboard;
		},
		getTrimmedValue: function(value) {
			return (new DOMParser)
				.parseFromString(value, 'text/html')
				.documentElement.textContent.toString()
				.trim();
		}
	};
}

 Input before passing to renderHTML function: 
'ServiceNow Impact recommendation: "Instance Observer Add-on"\n<p>Instance Observer provides a comprehensive overview of Instance health and Performance metrics.\n<a href="https://www.servicenow.com>Link</a>

Output from renderHTML:
Instance Observer Add-on"\n\nInstance Observer provides a comprehensive overview of Instance health and Performance metrics
<a href="https://www.servicenow.com>Link</a>

If I paste this output in outlook or even in anywhere this is not getting converted as hyperlink

Please someone help me with this issue.

Thanks!🙂


0 REPLIES 0