mudhorn/prometheus
1
0
Fork 0
mirror of https://github.com/prometheus/prometheus.git synced 2025-03-05 20:59:13 -08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

feat: render IPv6 links (#9853)

Browse source 
* feat: render IPv6 links

Signed-off-by: mtfoley <mtfoley.mae@gmail.com>
This commit is contained in:
Matthew 2021-11-29 10:33:47 -05:00 committed by GitHub
parent d677aa4b29
commit 8e9b8d499d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 33 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
web/ui/react-app/src/pages/targets/EndpointLink.test.tsx
View file

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import { shallow, mount } from 'enzyme'; import { shallow, mount } from 'enzyme';
import { Badge, Alert } from 'reactstrap'; import { Badge } from 'reactstrap';
import EndpointLink from './EndpointLink'; import EndpointLink from './EndpointLink';
describe('EndpointLink', () => { describe('EndpointLink', () => {
@ -29,11 +29,24 @@ describe('EndpointLink', () => {
const targetLabel = badges.filterWhere((badge) => badge.children().text() === 'target="http://some-service"'); const targetLabel = badges.filterWhere((badge) => badge.children().text() === 'target="http://some-service"');
expect(targetLabel.length).toEqual(1); expect(targetLabel.length).toEqual(1);
}); });
// In cases of IPv6 addresses with a Zone ID, URL may not be parseable.
it('renders an alert if url is invalid', () => { // See https://github.com/prometheus/prometheus/issues/9760
const endpointLink = shallow(<EndpointLink endpoint={'afdsacas'} globalUrl={'afdsacas'} />); it('renders an anchor for IPv6 link with zone ID including labels for query params', () => {
const err = endpointLink.find(Alert); const endpoint =
expect(err.render().text()).toEqual('Error: Invalid URL: afdsacas'); 'http://[fe80::f1ee:adeb:371d:983%eth1]:9100/stats/prometheus?module=http_2xx&target=http://some-service';
const globalURL =
'http://[fe80::f1ee:adeb:371d:983%eth1]:9100/stats/prometheus?module=http_2xx&target=http://some-service';
const endpointLink = shallow(<EndpointLink endpoint={endpoint} globalUrl={globalURL} />);
const anchor = endpointLink.find('a');
const badges = endpointLink.find(Badge);
expect(anchor.prop('href')).toEqual(globalURL);
expect(anchor.children().text()).toEqual('http://[fe80::f1ee:adeb:371d:983%eth1]:9100/stats/prometheus');
expect(endpointLink.find('br')).toHaveLength(1);
expect(badges).toHaveLength(2);
const moduleLabel = badges.filterWhere((badge) => badge.children().text() === 'module="http_2xx"');
expect(moduleLabel.length).toEqual(1);
const targetLabel = badges.filterWhere((badge) => badge.children().text() === 'target="http://some-service"');
expect(targetLabel.length).toEqual(1);
}); });
it('handles params with multiple values correctly', () => { it('handles params with multiple values correctly', () => {

23
web/ui/react-app/src/pages/targets/EndpointLink.tsx
View file

@ -1,5 +1,5 @@
import React, { FC } from 'react'; import React, { FC } from 'react';
import { Badge, Alert } from 'reactstrap'; import { Badge } from 'reactstrap';
export interface EndpointLinkProps { export interface EndpointLinkProps {
endpoint: string; endpoint: string;
@ -8,23 +8,28 @@ export interface EndpointLinkProps {
const EndpointLink: FC<EndpointLinkProps> = ({ endpoint, globalUrl }) => { const EndpointLink: FC<EndpointLinkProps> = ({ endpoint, globalUrl }) => {
let url: URL; let url: URL;
let search = '';
let invalidURL = false;
try { try {
url = new URL(endpoint); url = new URL(endpoint);
} catch (err: unknown) { } catch (err: unknown) {
const error = err as Error; // In cases of IPv6 addresses with a Zone ID, URL may not be parseable.
return ( // See https://github.com/prometheus/prometheus/issues/9760
<Alert color="danger"> // In this case, we attempt to prepare a synthetic URL with the
<strong>Error:</strong> {error.message} // same query parameters, for rendering purposes.
</Alert> invalidURL = true;
); if (endpoint.indexOf('?') > -1) {
search = endpoint.substring(endpoint.indexOf('?'));
}
url = new URL('http://0.0.0.0' + search);
} }
const { host, pathname, protocol, searchParams }: URL = url; const { host, pathname, protocol, searchParams }: URL = url;
const params = Array.from(searchParams.entries()); const params = Array.from(searchParams.entries());
const displayLink = invalidURL ? endpoint.replace(search, '') : `${protocol}//${host}${pathname}`;
return ( return (
<> <>
<a href={globalUrl}>{`${protocol}//${host}${pathname}`}</a> <a href={globalUrl}>{displayLink}</a>
{params.length > 0 ? <br /> : null} {params.length > 0 ? <br /> : null}
{params.map(([labelName, labelValue]: [string, string]) => { {params.map(([labelName, labelValue]: [string, string]) => {
return ( return (