Skip to content
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

fix(extension): Don't show full data:text/html content on generated HTML report page #2140

Merged
merged 4 commits into from
Jan 2, 2025
Merged

fix(extension): Don't show full data:text/html content on generated HTML report page #2140

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
d4dfec8
truncating url
nam-singh Dec 30, 2024
2a500f3
remove unused import
nam-singh Dec 30, 2024
b7f4551
Merge branch 'master' into 321-htmlReportUrl-nam
tombrunet Jan 2, 2025
1230593
Adjust tooltip location
tombrunet Jan 2, 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
49 changes: 44 additions & 5 deletions report-react/src/SavedReport.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import ScoreCard from './ScoreCard';
import SummScoreCard from './SummScoreCard';
import ReportChecklist from './report/ReportChecklist';
import ReportRules from './report/ReportRules';
import { ComposedModal, ModalHeader, ModalBody, Grid, Column, Theme,Dropdown,MultiSelect} from '@carbon/react';
import { ComposedModal, ModalHeader, ModalBody, Grid, Column, Theme,Dropdown,MultiSelect,CopyButton} from '@carbon/react';
import { UtilIssueReact } from "./util/UtilIssueReact";
import { Violation16,NeedsReview16,Recommendation16,ViewOff16 } from "./util/UtilImages";
import ReportElements from "./report/ReportElements";
Expand Down Expand Up @@ -75,6 +75,10 @@ export class SavedReport extends React.Component<SavedReportProps, SavedReportSt
this.setState({selectedItems:[...this.state.selectedItems,updatedFilter]})
}
}
copyToClipboard = () => {
if(this.props.reportData)
navigator.clipboard.writeText(this.props.reportData.tabURL)
};

render() {

Expand Down Expand Up @@ -173,10 +177,45 @@ const filteredReport = {
</Grid>
<section aria-label="Report overview: score cards">
<Grid>
<Column sm={4} md={4} lg={4}>
<div className="time" style={{paddingTop:"12px"}}>{new Date(this.props.reportData.report.timestamp).toLocaleString()}</div>
<div className="url"><strong>Scanned page:</strong> {this.props.reportData.tabURL}</div>
</Column>
<Column sm={4} md={4} lg={4}>
<div className="time" style={{ paddingTop: "12px" }}>
{new Date(this.props.reportData.report.timestamp).toLocaleString()}
</div>
<div
style={{
gap: "8px", // Add spacing between elements
}}
>
{/* URL with ellipsis */}
<div
className="url"
style={{
display: "-webkit-box",
WebkitLineClamp: 4, // Limit text to 4 lines
WebkitBoxOrient: "vertical",
overflow: "hidden",
textOverflow: "ellipsis",
wordBreak: "break-word", // Handle long URLs gracefully
}}
>
<strong>Scanned page:</strong>{" "}
<span title={this.props.reportData.tabURL}>{this.props.reportData.tabURL}</span>
</div>

{/* Copy button */}
<CopyButton
align="bottom-left"
iconDescription="Copy page URL to clipboard"
onClick={this.copyToClipboard}
feedback="Copied!"
feedbackTimeout={2000}
style={{
alignSelf: "flex-start",
marginTop: "4px",
}}
/>
</div>
</Column>
<Column sm={4} md={4} lg={4}>
<ScoreCard count={violations} title="Violations" icon={Violation16} checked={this.state.selectedItems.some((item)=>item.text==="Violations")}
handleCardClick={this.handleCardClick}>
Expand Down