RepoMirrors
/
prometheus
mirror of https://github.com/prometheus/prometheus
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Escape target selector for tooltip on targets page (#6892) 

This fixes an issue where the /new/targets page will not load when there
are jobs with invalid CSS characters in them, such as the
namespace/service/0 form used by the Prometheus Operator.

Signed-off-by: Chris Marchbanks <csmarchbanks@gmail.com>
This commit is contained in:
Chris Marchbanks 2020-02-28 12:27:45 -07:00 committed by GitHub
parent d137cddd12
commit 0e78908407
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/ui/react-app/src/pages/targets/TargetLabels.test.tsx
View File

@ -25,7 +25,7 @@ describe('targetLabels', () => {
it('renders a div of series labels', () => {
const div = targetLabels.find('div').filterWhere(elem => elem.hasClass('series-labels-container'));
expect(div).toHaveLength(1);
expect(div.prop('id')).toEqual('series-labels-cortex\\/node-exporter_group\\/0-1');
expect(div.prop('id')).toEqual('series-labels-cortex/node-exporter_group/0-1');
});
it('wraps each label in a label badge', () => {

4
web/ui/react-app/src/pages/targets/TargetLabels.tsx
View File

@ -20,7 +20,7 @@ const TargetLabels: FC<TargetLabelsProps> = ({ discoveredLabels, labels, idx, sc
const [tooltipOpen, setTooltipOpen] = useState(false);
const toggle = (): void => setTooltipOpen(!tooltipOpen);
const id = `series-labels-${CSS.escape(scrapePool)}-${idx}`;
const id = `series-labels-${scrapePool}-${idx}`;
return (
<>
@ -33,7 +33,7 @@ const TargetLabels: FC<TargetLabelsProps> = ({ discoveredLabels, labels, idx, sc
);
})}
</div>
<Tooltip isOpen={tooltipOpen} target={id} toggle={toggle} style={{ maxWidth: 'none', textAlign: 'left' }}>
<Tooltip isOpen={tooltipOpen} target={CSS.escape(id)} toggle={toggle} style={{ maxWidth: 'none', textAlign: 'left' }}>
<b>Before relabeling:</b>
{formatLabels(discoveredLabels).map((s: string, idx: number) => (
<Fragment key={idx}>

2
web/ui/react-app/src/pages/targets/__snapshots__/TargetLabels.test.tsx.snap
View File

@ -4,7 +4,7 @@ exports[`targetLabels renders discovered labels 1`] = `
<Fragment>
<div
className="series-labels-container"
id="series-labels-cortex\\\\/node-exporter_group\\\\/0-1"
id="series-labels-cortex/node-exporter_group/0-1"
>
<Badge
className="mr-1 instance"