Skip to content

Commit

Permalink
Merge pull request #236 from KoolTheba/feature/replace-minus-one-score
Browse files Browse the repository at this point in the history
Feature: replace minus one score
  • Loading branch information
KoolTheba authored Dec 16, 2023
2 parents 2dc3238 + 61bb8a3 commit 6d3bd14
Show file tree
Hide file tree
Showing 8 changed files with 142 additions and 63 deletions.
83 changes: 36 additions & 47 deletions cypress/e2e/comparator.cy.ts
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ describe("Comparator", () => {
"Please check if the org/repository/commit has been analysed by the Scorecard.",
);
});
it("should compare data from each commit as expected", () => {
it.only("should compare data from each commit as expected", () => {
cy.intercept(
"GET",
"https://api.securityscorecards.dev/projects/github.com/nodejs/node/?commit=2ac5e9889aba461f5a54d320973d2574980d206b",
Expand Down Expand Up @@ -177,31 +177,28 @@ describe("Comparator", () => {
"contain",
"Binary-Artifacts",
);
cy.get('[data-testid="Binary-Artifacts"] > div > span')
cy.get('[data-testid="Binary-Artifacts-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Binary-Artifacts"] > span').should("contain", "0/10");

cy.get('[data-testid="Binary-Artifacts-score"] > span').should("contain", "0/10");

cy.get('[data-testid="Branch-Protection"]').should(
"contain",
"Branch-Protection",
);
cy.get('[data-testid="Branch-Protection"] > div > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Branch-Protection"] > span').should(
cy.get('[data-testid="Branch-Protection-score"] > abbr > span').should(
"contain",
"-1/10",
"?",
);

cy.get('[data-testid="CI-Tests"]').should("contain", "CI-Tests");
cy.get('[data-testid="CI-Tests"] > div > span')
cy.get('[data-testid="CI-Tests-score"] > span')
.should("contain", "Decreased -1")
.and("have.css", "background-color")
.and("eq", "rgb(220, 53, 69)");
cy.get('[data-testid="CI-Tests"] > span').and("contain", "9/10");
cy.get('[data-testid="CI-Tests-score"] > span').and("contain", "9/10");
cy.get('[data-testid="CI-Tests"] ~ h4').should(
"contain",
"Additional details / variations",
Expand All @@ -211,42 +208,42 @@ describe("Comparator", () => {
"contain",
"CII-Best-Practices",
);
cy.get('[data-testid="CII-Best-Practices"] > div > span')
cy.get('[data-testid="CII-Best-Practices-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="CII-Best-Practices"] > span').should(
cy.get('[data-testid="CII-Best-Practices-score"] > span').should(
"contain",
"5/10",
);

cy.get('[data-testid="Code-Review"]').should("contain", "Code-Review");
cy.get('[data-testid="Code-Review"] > div > span')
cy.get('[data-testid="Code-Review-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Code-Review"] > span').should("contain", "0/10");
cy.get('[data-testid="Code-Review-score"] > span').should("contain", "0/10");
cy.get('[data-testid="Code-Review"] ~ h4').should(
"contain",
"Additional details / variations",
);

cy.get('[data-testid="Contributors"]').should("contain", "Contributors");
cy.get('[data-testid="Contributors"] > div > span')
cy.get('[data-testid="Contributors-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Contributors"] > span').should("contain", "10/10");
cy.get('[data-testid="Contributors-score"] > span').should("contain", "10/10");

cy.get('[data-testid="Dangerous-Workflow"]').should(
"contain",
"Dangerous-Workflow",
);
cy.get('[data-testid="Dangerous-Workflow"] > div > span')
cy.get('[data-testid="Dangerous-Workflow-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Dangerous-Workflow"] > span').should(
cy.get('[data-testid="Dangerous-Workflow-score"] > span').should(
"contain",
"10/10",
);
Expand All @@ -255,56 +252,52 @@ describe("Comparator", () => {
"contain",
"Dependency-Update-Tool",
);
cy.get('[data-testid="Dependency-Update-Tool"] > div > span')
cy.get('[data-testid="Dependency-Update-Tool-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Dependency-Update-Tool"] > span').should(
cy.get('[data-testid="Dependency-Update-Tool-score"] > span').should(
"contain",
"10/10",
);

cy.get('[data-testid="Fuzzing"]').should("contain", "Fuzzing");
cy.get('[data-testid="Fuzzing"] > div > span')
cy.get('[data-testid="Fuzzing-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Fuzzing"] > span').should("contain", "10/10");
cy.get('[data-testid="Fuzzing-score"] > span').should("contain", "10/10");

cy.get('[data-testid="License"]').should("contain", "License");
cy.get('[data-testid="License"] > div > span')
cy.get('[data-testid="License-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="License"] > span').should("contain", "9/10");
cy.get('[data-testid="License-score"] > span').should("contain", "9/10");

cy.get('[data-testid="Maintained"]').should("contain", "Maintained");
cy.get('[data-testid="Maintained"] > div > span')
cy.get('[data-testid="Maintained-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Maintained"] > span').should("contain", "10/10");
cy.get('[data-testid="Maintained-score"] > span').should("contain", "10/10");
cy.get('[data-testid="Maintained"] ~ h4').should(
"contain",
"Additional details / variations",
);

cy.get('[data-testid="Packaging"]').should("contain", "Packaging");
cy.get('[data-testid="Packaging"] > div > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Packaging"] > span').should("contain", "-1/10");
cy.get('[data-testid="Packaging-score"] > abbr > span').should("contain", "?");

cy.get('[data-testid="Pinned-Dependencies"]').should(
"contain",
"Pinned-Dependencies",
);
cy.get('[data-testid="Pinned-Dependencies"] > div > span')
cy.get('[data-testid="Pinned-Dependencies-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Pinned-Dependencies"] > span').should(
cy.get('[data-testid="Pinned-Dependencies-score"] > span').should(
"contain",
"7/10",
);
Expand All @@ -314,41 +307,37 @@ describe("Comparator", () => {
);

cy.get('[data-testid="SAST"]').should("contain", "SAST");
cy.get('[data-testid="SAST"] > div > span')
cy.get('[data-testid="SAST-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="SAST"] > span').should("contain", "0/10");
cy.get('[data-testid="SAST-score"] > span').should("contain", "0/10");

cy.get('[data-testid="Security-Policy"]').should(
"contain",
"Security-Policy",
);
cy.get('[data-testid="Security-Policy"] > div > span')
cy.get('[data-testid="Security-Policy-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Security-Policy"] > span').should("contain", "10/10");
cy.get('[data-testid="Security-Policy-score"] > span').should("contain", "10/10");

cy.get('[data-testid="Signed-Releases"]').should(
"contain",
"Signed-Releases",
);
cy.get('[data-testid="Signed-Releases"] > div > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Signed-Releases"] > span').should("contain", "-1/10");
cy.get('[data-testid="Signed-Releases-score"] > abbr > span').should("contain", "?");

cy.get('[data-testid="Token-Permissions"]').should(
"contain",
"Token-Permissions",
);
cy.get('[data-testid="Token-Permissions"] > div > span')
cy.get('[data-testid="Token-Permissions-score"] > span')
.should("contain", "Unchanged")
.and("have.css", "background-color")
.and("eq", "rgb(108, 117, 125)");
cy.get('[data-testid="Token-Permissions"] > span').should(
cy.get('[data-testid="Token-Permissions-score"] > span').should(
"contain",
"10/10",
);
Expand All @@ -361,11 +350,11 @@ describe("Comparator", () => {
"contain",
"Vulnerabilities",
);
cy.get('[data-testid="Vulnerabilities"] > div > span')
cy.get('[data-testid="Vulnerabilities-score"] > span')
.should("contain", "Increased 2.7")
.and("have.css", "background-color")
.and("eq", "rgb(24, 135, 84)");
cy.get('[data-testid="Vulnerabilities"] > span').should("contain", "10/10");
cy.get('[data-testid="Vulnerabilities-score"] > span').should("contain", "10/10");
cy.get('[data-testid="Vulnerabilities"] ~ h4').should(
"contain",
"Additional details / variations",
Expand Down
12 changes: 6 additions & 6 deletions cypress/e2e/visualizer.cy.ts
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ describe("Visualizer", () => {
.and("contain", "0/10");
cy.get('[data-testid="Branch-Protection"]')
.should("contain", "Branch-Protection")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="CI-Tests"]')
.should("contain", "CI-Tests")
.and("contain", "9/10");
Expand Down Expand Up @@ -149,7 +149,7 @@ describe("Visualizer", () => {
.and("contain", "10/10");
cy.get('[data-testid="Packaging"]')
.should("contain", "Packaging")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="Pinned-Dependencies"]')
.should("contain", "Pinned-Dependencies")
.and("contain", "7/10");
Expand All @@ -161,7 +161,7 @@ describe("Visualizer", () => {
.and("contain", "10/10");
cy.get('[data-testid="Signed-Releases"]')
.should("contain", "Signed-Releases")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="Token-Permissions"]')
.should("contain", "Token-Permissions")
.and("contain", "10/10");
Expand Down Expand Up @@ -239,7 +239,7 @@ describe("Visualizer", () => {
.and("contain", "0/10");
cy.get('[data-testid="Branch-Protection"]')
.should("contain", "Branch-Protection")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="CI-Tests"]')
.should("contain", "CI-Tests")
.and("contain", "9/10");
Expand Down Expand Up @@ -269,7 +269,7 @@ describe("Visualizer", () => {
.and("contain", "10/10");
cy.get('[data-testid="Packaging"]')
.should("contain", "Packaging")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="Pinned-Dependencies"]')
.should("contain", "Pinned-Dependencies")
.and("contain", "7/10");
Expand All @@ -281,7 +281,7 @@ describe("Visualizer", () => {
.and("contain", "10/10");
cy.get('[data-testid="Signed-Releases"]')
.should("contain", "Signed-Releases")
.and("contain", "-1/10");
.and("contain", "?");
cy.get('[data-testid="Token-Permissions"]')
.should("contain", "Token-Permissions")
.and("contain", "10/10");
Expand Down
9 changes: 9 additions & 0 deletions src/components/NoAvailableDataMark.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import "../styles/NoAvailableDataMark.css";

export default function NoAvailableDataMark() {
return (
<abbr className="tooltip tooltip--top" data-tooltip="Data not available">
<span className="not-available-data">?</span>
</abbr>
);
}
19 changes: 13 additions & 6 deletions src/components/ProjectComparator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import { scoreChecker } from "../utils/comparator/scoreChecker";
import CommonError from "./CommonError";
import Collapsible from "./Collapsable";
import Loading from "./Loading";
import NoAvailableDataMark from "./NoAvailableDataMark";
import { ComparatorDiff } from "./ComparatorDiff";
import { ScoreElement, ConsolidatedScoreElement } from "../types";
import { getRefinedChecks } from "../utils/comparator/getRefinedChecks";
Expand Down Expand Up @@ -100,10 +101,7 @@ function ProjectComparator() {
return (
<>
<h1>OpenSSF Scorecard comparator for {`${org}/${repo}`}</h1>
<div
data-testid="current-score-and-badge"
className="info-badge__wrapper"
>
<div data-testid="current-score-and-badge" className="score-wrapper">
<h2>{`Current Score: ${currentData.score}/10`} </h2>
{scoreChecker(currentData.score, previousData.score)}
</div>
Expand Down Expand Up @@ -156,10 +154,19 @@ function ProjectComparator() {
<div data-testid={element.name} className="heading__wrapper">
<div className="info-badge__wrapper">
<h3>{element.name}</h3>
{scoreChecker(element.score, element.prevScore)}
<div data-testid={`${element.name}-score`} className="info-score__wrapper">
{element.score >= 0 ? (
<>
{scoreChecker(element.score, element.prevScore)}
<span>{element.score}/10</span>
</>
) : (
<NoAvailableDataMark />
)}
</div>
</div>
<span>{element.score}/10</span>
</div>

<p>
Description: {element.short.toLocaleLowerCase()}{" "}
<a href={`${element.url}`} target="_blank" rel="noreferrer">
Expand Down
8 changes: 6 additions & 2 deletions src/components/ProjectDetails.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { formatDate } from "../utils/formatDate";
import CommonError from "./CommonError";
import Collapsible from "./Collapsable";
import Loading from "./Loading";

import NoAvailableDataMark from "./NoAvailableDataMark";
import { ScoreElement } from "../types";
import { GITHUB } from "../constants/platforms";

Expand Down Expand Up @@ -93,7 +93,11 @@ function ProjectDetails() {
<div key={element.name} className="card__wrapper">
<div className="heading__wrapper" data-testid={element.name}>
<h3>{element.name}</h3>
<span>{element.score}/10</span>
{element.score !== -1 ? (
<span>{element.score}/10</span>
) : (
<NoAvailableDataMark />
)}
</div>
<p>
Description: {element.documentation.short.toLocaleLowerCase()}{" "}
Expand Down
3 changes: 2 additions & 1 deletion src/styles/Badge.css
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
.badge {
width: auto;
padding: 0.4rem;
margin-right: 1rem;
color: white;
background-color: #6c757d;
border-radius: 5px;
font-size: 1rem;
font-size: 14px;
display: inline-block;
font-weight: 600;
}
Expand Down
Loading

0 comments on commit 6d3bd14

Please sign in to comment.