Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-08-23 13:46:45 +02:00
Code Issues Projects Releases Wiki Activity

revert changes to HTML semantics

Browse Source
This commit is contained in:
Thomas Heartman 2025-07-02 13:38:37 +02:00
parent 5197032bfb
commit 564c3ec2ba
2 changed files with 33 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/NameWithChangeInfo/NameWithChangeInfo.test.tsx
View File

@ -19,7 +19,7 @@ test.each(['', undefined])(
).toBeNull();
// expect ins element with new strategy name
await screen.findByText(newName, { selector: 'p' });
await screen.findByText(newName, { selector: 'ins' });
},
);
@ -35,7 +35,9 @@ test.each(['', undefined])(
);
// expect no ins elements
expect(screen.queryByText(newName || '', { selector: 'p' })).toBeNull();
expect(
screen.queryByText(newName || '', { selector: 'ins' }),
).toBeNull();
// expect del element with old strategy name
await screen.findByText(previousName, { selector: 'del' });
@ -53,13 +55,25 @@ test('Should render the old name as deleted and the new name as inserted if the
await screen.findByText(previousName, { selector: 'del' });
// expect ins element with new strategy name
await screen.findByText(newName, { selector: 'p' });
await screen.findByText(newName, { selector: 'ins' });
});
test('Should render the name in a span if it has not changed', async () => {
const name = 'name';
render(<NameWithChangeInfo newName={name} previousName={name} />);
// expect no del or ins elements
expect(screen.queryByText(name, { selector: 'ins' })).toBeNull();
expect(screen.queryByText(name, { selector: 'del' })).toBeNull();
// expect span element with the strategy name
await screen.findByText(name, { selector: 'span' });
});
test('Should render nothing if there was no name and there is still no name', async () => {
render(<NameWithChangeInfo newName={undefined} previousName={undefined} />);
expect(screen.queryByText('', { selector: 'p' })).toBeNull();
expect(screen.queryByText('', { selector: 'ins' })).toBeNull();
expect(screen.queryByText('', { selector: 'del' })).toBeNull();
expect(screen.queryByText('', { selector: 'span' })).toBeNull();
});

17
frontend/src/component/changeRequest/ChangeRequest/Changes/Change/NameWithChangeInfo/NameWithChangeInfo.tsx
View File

@ -1,5 +1,5 @@
import type { FC } from 'react';
import { Typography, styled } from '@mui/material';
import { Typography, type TypographyProps, styled } from '@mui/material';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { textTruncated } from 'themes/themeStyles';
@ -9,11 +9,18 @@ const Truncated = styled('span')(() => ({
display: 'block',
}));
const NewName = styled(Typography)<TypographyProps>({
textDecoration: 'none',
});
export const NameWithChangeInfo: FC<{
newName: string | undefined;
previousName: string | undefined;
}> = ({ newName, previousName }) => {
const titleHasChanged = Boolean(previousName && previousName !== newName);
const titleHasChangedOrBeenAdded = Boolean(
titleHasChanged || (!previousName && newName),
);
return (
<>
@ -31,7 +38,13 @@ export const NameWithChangeInfo: FC<{
condition={Boolean(newName)}
show={
<Truncated>
<Typography component='span'>{newName}</Typography>
<NewName
component={
titleHasChangedOrBeenAdded ? 'ins' : 'span'
}
>
{newName}
</NewName>
</Truncated>
}
/>