DataLinks: Fixes datalinks with onClick and variables in url not being interpolated (#86253)

* Use replaceVariables method on link url, fix and add unit tests

* Refactor href processing for links

* Prettier
This commit is contained in:
gng0 2024-05-28 18:16:55 +12:00 committed by GitHub
parent 0b526acf09
commit f772056296
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 61 additions and 17 deletions

View File

@ -971,7 +971,7 @@ describe('getLinksSupplier', () => {
});
it('handles link click handlers', () => {
const onClickSpy = jest.fn();
const replaceSpy = jest.fn();
const replaceSpy = jest.fn().mockImplementation((value, vars, format) => value);
const f0 = createDataFrame({
name: 'A',
fields: [
@ -1008,8 +1008,8 @@ describe('getLinksSupplier', () => {
links[0].onClick!({});
expect(onClickSpy).toBeCalledTimes(1);
expect(replaceSpy).toBeCalledTimes(4);
expect(onClickSpy).toHaveBeenCalledTimes(1);
expect(replaceSpy).toHaveBeenCalledTimes(5);
// check that onClick variable replacer has scoped vars bound to it
expect(replaceSpy.mock.calls[1][1]).toHaveProperty('foo', { text: 'bar', value: 'bar' });
});
@ -1057,6 +1057,49 @@ describe('getLinksSupplier', () => {
expect(replaceSpy.mock.calls[1][1]).toHaveProperty('foo', { text: 'bar', value: 'bar' });
});
});
it('handles dynamic links with onclick handler', () => {
const replaceSpy = jest.fn().mockReturnValue('url interpolated 10');
const onClickUrlSpy = jest.fn();
const scopedVars = { foo: { text: 'bar', value: 'bar' } };
const f0 = createDataFrame({
name: 'A',
fields: [
{
name: 'message',
type: FieldType.string,
config: {
links: [
{
url: 'should be ignored',
onClick: (evt) => {
onClickUrlSpy();
evt.replaceVariables?.('${foo}');
},
title: 'title to be interpolated',
},
{
url: 'should not be ignored',
title: 'title to be interpolated',
},
],
},
},
],
});
const supplier = getLinksSupplier(f0, f0.fields[0], scopedVars, replaceSpy);
const links = supplier({});
links[0].onClick!({});
expect(onClickUrlSpy).toHaveBeenCalledTimes(1);
expect(links.length).toBe(2);
expect(links[0].href).toEqual('url interpolated 10');
expect(links[0].onClick).toBeDefined();
expect(replaceSpy).toHaveBeenCalledTimes(5);
// check that onClick variable replacer has scoped vars bound to it
expect(replaceSpy.mock.calls[1][1]).toHaveProperty('foo', { text: 'bar', value: 'bar' });
});
});
describe('applyRawFieldOverrides', () => {

View File

@ -468,9 +468,23 @@ export const getLinksSupplier =
let linkModel: LinkModel<Field>;
let href =
link.onClick || !link.onBuildUrl
? link.url
: link.onBuildUrl({
origin: field,
replaceVariables: boundReplaceVariables,
});
if (href) {
href = locationUtil.assureBaseUrl(href.replace(/\n/g, ''));
href = replaceVariables(href, dataLinkScopedVars, VariableFormatID.UriEncode);
href = locationUtil.processUrl(href);
}
if (link.onClick) {
linkModel = {
href: link.url,
href,
title: replaceVariables(link.title || '', dataLinkScopedVars),
target: link.targetBlank ? '_blank' : undefined,
onClick: (evt: MouseEvent, origin: Field) => {
@ -483,19 +497,6 @@ export const getLinksSupplier =
origin: field,
};
} else {
let href = link.onBuildUrl
? link.onBuildUrl({
origin: field,
replaceVariables: boundReplaceVariables,
})
: link.url;
if (href) {
href = locationUtil.assureBaseUrl(href.replace(/\n/g, ''));
href = replaceVariables(href, dataLinkScopedVars, VariableFormatID.UriEncode);
href = locationUtil.processUrl(href);
}
linkModel = {
href,
title: replaceVariables(link.title || '', dataLinkScopedVars),