Skip to content

Put radio buttons into labels #5738

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
canova merged 1 commit into from
Dec 25, 2025
Merged

Put radio buttons into labels #5738

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
11 changes: 4 additions & 7 deletions src/components/shared/StackImplementationSetting.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ class StackImplementationSettingImpl extends PureComponent<Props> {
) {
const htmlId = `implementation-radio-${implementationFilter}`;
return (
<>
<label className="photon-label photon-label-micro" htmlFor={htmlId}>
<Localized id={labelL10nId} attrs={{ title: true }}>
<input
type="radio"
Expand All @@ -58,13 +58,10 @@ class StackImplementationSettingImpl extends PureComponent<Props> {
checked={this.props.implementationFilter === implementationFilter}
/>
</Localized>
<Localized id={labelL10nId} attrs={{ title: true }}>
<label
className="photon-label photon-label-micro photon-label-horiz-padding"
htmlFor={htmlId}
></label>
<Localized id={labelL10nId}>
<span className="photon-label-horiz-padding"></span>
</Localized>
</>
</label>
);
}

Expand Down
71 changes: 40 additions & 31 deletions src/test/components/__snapshots__/FlameGraph.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -415,48 +415,57 @@ exports[`FlameGraph matches the snapshot 1`] = `
<li
class="panelSettingsListItem"
>
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-combined"
title="Do not filter the stack frames"
>
All frames
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<span
class="photon-label-horiz-padding"
>
All frames
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-js"
title="Show only the stack frames related to script execution"
>
Script
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<span
class="photon-label-horiz-padding"
>
Script
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-cpp"
title="Show only the stack frames for native code"
>
Native
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<span
class="photon-label-horiz-padding"
>
Native
</span>
</label>
</li>
</ul>
Expand Down
71 changes: 40 additions & 31 deletions src/test/components/__snapshots__/MarkerChart.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -449,48 +449,57 @@ exports[`MarkerChart renders the normal marker chart and matches the snapshot 1`
>
Filter stacks:
</span>
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-combined"
title="Do not filter the stack frames"
>
All frames
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<span
class="photon-label-horiz-padding"
>
All frames
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-js"
title="Show only the stack frames related to script execution"
>
Script
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<span
class="photon-label-horiz-padding"
>
Script
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-cpp"
title="Show only the stack frames for native code"
>
Native
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<span
class="photon-label-horiz-padding"
>
Native
</span>
</label>
</li>
</ul>
Expand Down
71 changes: 40 additions & 31 deletions src/test/components/__snapshots__/MarkerTable.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,48 +55,57 @@ exports[`MarkerTable renders some basic markers and updates when needed 1`] = `
>
Filter stacks:
</span>
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-combined"
title="Do not filter the stack frames"
>
All frames
<input
checked=""
class="photon-radio photon-radio-micro"
id="implementation-radio-combined"
title="Do not filter the stack frames"
type="radio"
value="combined"
/>
<span
class="photon-label-horiz-padding"
>
All frames
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-js"
title="Show only the stack frames related to script execution"
>
Script
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-js"
title="Show only the stack frames related to script execution"
type="radio"
value="js"
/>
<span
class="photon-label-horiz-padding"
>
Script
</span>
</label>
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<label
class="photon-label photon-label-micro photon-label-horiz-padding"
class="photon-label photon-label-micro"
for="implementation-radio-cpp"
title="Show only the stack frames for native code"
>
Native
<input
class="photon-radio photon-radio-micro"
id="implementation-radio-cpp"
title="Show only the stack frames for native code"
type="radio"
value="cpp"
/>
<span
class="photon-label-horiz-padding"
>
Native
</span>
</label>
</li>
</ul>
Expand Down
Loading