Skip to content

frontend: Fix several issues with storybook tests #3580

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sniok merged 7 commits into from
Jul 7, 2025
+744 −523
Merged

frontend: Fix several issues with storybook tests #3580

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
045d65b
frontend: ObjectEventList: Fix network request mocking
sniok Jul 7, 2025
5399533
frontend: DocsViewer: Fix msw handlers definition
sniok Jul 7, 2025
2b68ddd
frontend: GraphView: Add missing request mocking to the story
sniok Jul 7, 2025
c28e1f4
frontend: ServiceDetails: Add missing network request mocks
sniok Jul 7, 2025
aaaa518
frontend: StatefulSetList: Fix msw handlers definition
sniok Jul 7, 2025
1baf82b
frontend: StatefulSetDetails: Fix msw handlers definition
sniok Jul 7, 2025
88ff05a
frontend: Storyshots: Add check for missing network request mocks
sniok Jul 7, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
94 changes: 53 additions & 41 deletions frontend/src/components/common/ObjectEventList.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -116,35 +116,42 @@ export default {
],
parameters: {
msw: {
handlers: [
http.get('/api/v1/namespaces/:namespace/events', ({ params, request }) => {
const url = new URL(request.url);
const fieldSelector = url.searchParams.get('fieldSelector');
const reqNamespace = params.namespace;
handlers: {
story: [
http.get(
'http://localhost:4466/api/v1/namespaces/:namespace/events',
({ params, request }) => {
const url = new URL(request.url);
const fieldSelector = url.searchParams.get('fieldSelector');
const reqNamespace = params.namespace;

if (
reqNamespace === mockOwnerObject.metadata.namespace &&
fieldSelector &&
fieldSelector.includes(`involvedObject.kind=${mockOwnerObject.kind}`) &&
fieldSelector.includes(`involvedObject.name=${mockOwnerObject.metadata.name}`)
) {
return HttpResponse.json({
kind: 'EventList',
items: mockEvents,
metadata: {},
});
}
if (
reqNamespace === mockOwnerObjectNoEvents.metadata.namespace &&
fieldSelector &&
fieldSelector.includes(`involvedObject.kind=${mockOwnerObjectNoEvents.kind}`) &&
fieldSelector.includes(`involvedObject.name=${mockOwnerObjectNoEvents.metadata.name}`)
) {
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}),
],
if (
reqNamespace === mockOwnerObject.metadata.namespace &&
fieldSelector &&
fieldSelector.includes(`involvedObject.kind=${mockOwnerObject.kind}`) &&
fieldSelector.includes(`involvedObject.name=${mockOwnerObject.metadata.name}`)
) {
return HttpResponse.json({
kind: 'EventList',
items: mockEvents,
metadata: {},
});
}
if (
reqNamespace === mockOwnerObjectNoEvents.metadata.namespace &&
fieldSelector &&
fieldSelector.includes(`involvedObject.kind=${mockOwnerObjectNoEvents.kind}`) &&
fieldSelector.includes(
`involvedObject.name=${mockOwnerObjectNoEvents.metadata.name}`
)
) {
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}
),
],
},
},
},
argTypes: {
Expand Down Expand Up @@ -184,19 +191,24 @@ ErrorFetching.args = {
};
ErrorFetching.parameters = {
msw: {
handlers: [
http.get('/api/v1/namespaces/errors/events', ({ request }) => {
const url = new URL(request.url);
const fieldSelector = url.searchParams.get('fieldSelector');
if (fieldSelector && fieldSelector.includes('involvedObject.name=error-secret')) {
return HttpResponse.json(
{ message: 'Simulated server error fetching events' },
{ status: 500 }
);
}
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}),
],
handlers: {
story: [
http.get('http://localhost:4466/api/v1/namespaces/default/events', () => {
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}),
http.get('http://localhost:4466/api/v1/namespaces/errors/events', ({ request }) => {
const url = new URL(request.url);
const fieldSelector = url.searchParams.get('fieldSelector');
if (fieldSelector && fieldSelector.includes('involvedObject.name=error-secret')) {
return HttpResponse.json(
{ message: 'Simulated server error fetching events' },
{ status: 500 }
);
}
return HttpResponse.json({ kind: 'EventList', items: [], metadata: {} });
}),
],
},
},
};
ErrorFetching.storyName = 'Error Fetching Events';
116 changes: 60 additions & 56 deletions frontend/src/components/common/Resource/DocsViewer.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,74 +25,76 @@ export default {
argTypes: {},
parameters: {
msw: {
handlers: [
http.get('http://localhost:4466/openapi/v2', () =>
HttpResponse.json({
swagger: '2.0',
info: { title: 'Test API', version: '1.0.0' },
paths: {},
definitions: {
'io.k8s.api.core.v1.Pod': {
'x-kubernetes-group-version-kind': [{ group: '', version: 'v1', kind: 'Pod' }],
properties: {
apiVersion: {
type: 'string',
description: `
handlers: {
story: [
http.get('http://localhost:4466/openapi/v2', () =>
HttpResponse.json({
swagger: '2.0',
info: { title: 'Test API', version: '1.0.0' },
paths: {},
definitions: {
'io.k8s.api.core.v1.Pod': {
'x-kubernetes-group-version-kind': [{ group: '', version: 'v1', kind: 'Pod' }],
properties: {
apiVersion: {
type: 'string',
description: `
APIVersion defines the versioned schema of this representation of an object.
Servers should convert recognized schemas to the latest internal value,
and may reject unrecognized values.
More info: https://git.k8s.io/community/contributors/devel/sig-architecture/api-conventions.md#resources
`,
},
kind: {
type: 'string',
description: `
},
kind: {
type: 'string',
description: `
Kind is a string value representing the REST resource this object represents.
Servers may infer this from the endpoint the client submits requests to. Cannot be updated. In CamelCase.
More info: https://git.k8s.io/community/contributors/devel/sig-architecture/api-conventions.md#types-kinds',
`,
},
metadata: {
type: 'object',
description: `Standard object's metadata.
},
metadata: {
type: 'object',
description: `Standard object's metadata.
More info: https://git.k8s.io/community/contributors/devel/sig-architecture/api-conventions.md#metadata`,
properties: {
annotations: {
type: 'object',
description: `Annotations is an unstructured key value map stored with a resource that may be set by external tools to store and retrieve arbitrary metadata.
properties: {
annotations: {
type: 'object',
description: `Annotations is an unstructured key value map stored with a resource that may be set by external tools to store and retrieve arbitrary metadata.
They are not queryable and should be preserved when modifying objects.
More info: https://kubernetes.io/docs/concepts/overview/working-with-objects/annotations`,
},
creationTimestamp: {
type: 'string',
description:
'CreationTimestamp is a timestamp representing the server time when this object was created',
},
deletionTimestamp: {
type: 'string',
description:
'DeletionTimestamp is RFC 3339 date and time at which this resource will be deleted.',
},
creationTimestamp: {
type: 'string',
description:
'CreationTimestamp is a timestamp representing the server time when this object was created',
},
deletionTimestamp: {
type: 'string',
description:
'DeletionTimestamp is RFC 3339 date and time at which this resource will be deleted.',
},
},
},
},
spec: {
type: 'object',
description: `Specification of the desired behavior of the pod.
spec: {
type: 'object',
description: `Specification of the desired behavior of the pod.
More info: https://git.k8s.io/community/contributors/devel/sig-architecture/api-conventions.md#spec-and-status`,
properties: {
containers: {
type: 'array',
description: `List of containers belonging to the pod. Containers cannot currently be added or removed.
properties: {
containers: {
type: 'array',
description: `List of containers belonging to the pod. Containers cannot currently be added or removed.
There must be at least one container in a Pod. Cannot be updated.`,
},
},
},
},
},
},
},
})
),
],
})
),
],
},
},
},
decorators: [
Expand Down Expand Up @@ -127,14 +129,16 @@ ErrorDocumentation.args = {
};
ErrorDocumentation.parameters = {
msw: {
handlers: [
http.get(
'http://localhost:4466/openapi/v2',
() =>
new HttpResponse(null, {
status: 500,
})
),
],
handlers: {
story: [
http.get(
'http://localhost:4466/openapi/v2',
() =>
new HttpResponse(null, {
status: 500,
})
),
],
},
},
};
Loading
Loading