jekyll-report-dashboard 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: dfa8bb49712438107cedcba73dc2e12b2f973e44184b7741a7b8e7eeb27eb3d3
+  data.tar.gz: fd85df1b4a0865ce4e662a71a8efecf15f2c891ac6c5029f37eb51cf35f9cd24
+SHA512:
+  metadata.gz: 60ed5d2135f8f7c97ae4e26ad7665e4c6006fe4179f3e3becea3ba6cef155fb61f95452d377f831a008ccd07d08227319a32596ade37458682d211e28968d00e
+  data.tar.gz: 2e47a6fe3f85cc2f0442b5ec8c8da0d0f0cc01bff55948fb6a2aa64f5d20eab79095efd8076668d4d78066a1a69ceb5b8c54640b69b897abe1693a818f2640b8

data/404.html

@@ -0,0 +1,11 @@
+---
+permalink: /404.html
+layout: default
+---
+
+<div class="my-3 mx-auto max-w-[37.5rem] text-center">
+  <h1 class="my-8 text-6xl leading-none tracking-tighter">404</h1>
+
+  <p><strong>Page not found :(</strong></p>
+  <p>The requested page could not be found.</p>
+</div>

data/_data/coverage/thresholds.yml

@@ -0,0 +1,11 @@
+pass:
+  lines: 90
+  functions: 85
+  statements: 90
+  branches: 80
+
+fail:
+  lines: 70
+  functions: 65
+  statements: 70
+  branches: 60

data/_includes/coverage-summary.html

@@ -0,0 +1,36 @@
+{% if include.total %}
+  <!-- if total was included, display the summary -->
+  <div class="mt-4 @container flex flex-row gap-2">
+    <!-- loop through the keys in total -->
+    {% for stat in include.total %}
+      <!-- assign the key to name -->
+      {% assign name = stat[0] %}
+      <!-- the coverage summary includes a field called "branchesTrue", but we want to skip it because it's a duplicate of "branches" -->
+      {% if name != "branchesTrue" %}
+        <!-- assign the value to values -->
+        {% assign values = stat[1] %}
+          <div class="w-full px-1 py-2 @md:px-2 @md:py-4 leading-none border rounded-sm border-outline flex flex-col items-center gap-4 @sm:gap-8 @md:gap-10">
+          <div class="font-medium text-sm @sm:text-base @md:text-lg @lg:text-xl">
+            <!-- Liquid provides a helper method to capitalize text -->
+            {{ name | capitalize }}
+          </div>
+          <!-- use the custom coverage_status filter with the stat name to get the correct styling for the percent -->
+          <div class="font-bold text-xl @sm:text-2xl @md:text-3xl @lg:text-4xl {{ values.pct | coverage_status: name }}">
+            <!-- Liquid provides a helper method for rounding floats to a number -->
+            {{ values.pct | round: 1 }}%
+          </div>
+          <div class="font-light text-xs @sm:text-base @md:text-base @lg:text-lg">
+            {{ values.covered }} / {{ values.total }}
+          </div>
+        </div>
+      {% endif %}
+    {% endfor %}
+  </div>
+  <div class="flex justify-end mt-4 min-h-4">
+    <!-- Liquid provides a helper method that will create the link relative to the baseurl set in _config.yml -->
+    <a href="{{ '/coverage' | relative_url }}" target="_blank">View Full Report</a>
+  </div>
+{% else %}
+  <!-- if the total was not included, display a message that there is nothing to display -->
+  <div>There is currently no coverage report for {{ include.branch }}.</div>
+{% endif %}

data/_includes/footer.html

@@ -0,0 +1,35 @@
+<footer class="border-t border-outline">
+  <data href="{{ "/" | relative_url }}"></data>
+
+  <div class="wrapper my-4 sm:grid sm:grid-rows-3">
+
+    <h2 class="text-lg sm:row-start-1">{{ site.title | escape }}</h2>
+
+    <div class="text-sm text-secondary sm:row-start-2 sm:row-span-2 sm:grid sm:grid-cols-4">
+      <div class="sm:col-start-1">
+        <ul class="mb-4 ml-0 list-none sm:m-0">
+          <li>
+            {%- if site.author -%}
+              {{ site.author | escape }}
+            {%- else -%}
+              {{ site.title | escape }}
+            {%- endif -%}
+          </li>
+          {%- if site.email -%}
+            <li>
+              <a href="mailto:{{ site.email }}">{{ site.email }}</a>
+            </li>
+          {%- endif -%}
+        </ul>
+      </div>
+
+      <div class="sm:col-start-2"></div>
+
+      <div class="sm:col-start-3 sm:col-span-2">
+        <p>{{- site.description | escape -}}</p>
+      </div>
+    </div>
+
+  </div>
+
+</footer>

data/_includes/head.html

@@ -0,0 +1,6 @@
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="stylesheet" href="{{ '/assets/css/styles.css' | relative_url }}">
+</head>

data/_includes/header.html

@@ -0,0 +1,40 @@
+<header class="border-t-4 border-t-tertiary border-b border-b-outline" role="banner">
+
+  <div class="wrapper relative flex flex-row justify-between items-center">
+    {%- assign default_paths = site.pages | map: "path" -%}
+    {%- assign page_paths = site.nav_pages | default: default_paths -%}
+    <a
+      class="text-secondary hover:text-primary text-2xl/14 font-light tracking-tighter"
+      rel="author"
+      href="{{ "/" | relative_url }}">{{ site.title | escape }}</a>
+
+    {%- if page_paths -%}
+      <nav class="absolute top-2 right-4 border border-outline rounded-md bg-light-primary md:relative md:top-auto md:right-auto md:border-none">
+        <input
+          type="checkbox"
+          id="nav-trigger"
+          class="hidden peer" />
+        <label for="nav-trigger" class="w-9 h-9 z-2 float-right flex justify-center items-center cursor-pointer md:hidden">
+          <span class="w-5 h-4 leading-0 md:hidden">
+            <svg
+              viewBox="0 0 18 15"
+              width="18px"
+              height="15px"
+              class="fill-secondary">
+              <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z" />
+            </svg>
+          </span>
+        </label>
+
+        <div class="hidden clear-both peer-checked:flex flex-col items-end px-4 pb-4 gap-2 md:flex md:flex-row md:p-0 md:gap-5 md:justify-end md:items-center">
+          {%- for path in page_paths -%}
+            {%- assign my_page = site.pages | where: "path", path | first -%}
+            {%- if my_page.title -%}
+              <a class="text-primary cursor-pointer leading-[24px]" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
+            {%- endif -%}
+          {%- endfor -%}
+        </div>
+      </nav>
+    {%- endif -%}
+  </div>
+</header>

data/_includes/playwright-branch-list.html

@@ -0,0 +1,28 @@
+{% if site.data.playwright-reports.branches.size > 0 %}
+  <!-- if there are branches in the data, display the summaries for the branches -->
+  {% for branch in site.data.playwright-reports.branches %}
+    <!-- loop through the branches and assign the key as the branch_name -->
+    {% assign branch_name = branch[0] %}
+    <!-- capture creates a link using the branch_name -->
+    {% capture branch_link %}/playwright-reports/branches/{{branch_name}}{% endcapture %}
+    <div class="mt-8 flex flex-row justify-between items-end">
+      <h3 class="mb-0">{{ branch_name }}</h3>
+      <!-- Liquid provides a helper method that will create the link relative to the baseurl set in _config.yml -->
+      <a href="{{ branch_link | relative_url }}">View Previous Runs</a>
+    </div>
+
+    <!-- use the custom key_list filter to get all of the run_ids in the branch, then reverse the list and get the first one -->
+    {% assign latest_run_id = site.data.playwright-reports.branches[branch_name] | key_list | reverse | first %}
+    {% assign data = site.data.playwright-reports.branches[branch_name][latest_run_id] %}
+    <!-- capture creates a link to the actual report file-->
+    {% capture report_link %}/playwright-reports/branches/{{branch_name}}/{{latest_run_id}}.html{% endcapture %}
+    <!--
+      Include the html snippet in `_includes/playwright-summary.html` with the parameters the `branch_name` variable as `branch`,
+      the `latest_run_id` variable as `run_id`, the `data` variable as `data`, and the `report_link` variable as `url`.
+    -->
+    {% include playwright-summary.html branch=branch_name run_id=latest_run_id data=data url=report_link %}
+  {% endfor %}
+{% else %}
+  <!-- if there are no branches in the data, display a message that there is nothing to display -->
+  <div>There are currently no branch reports.</div>
+{% endif %}

data/_includes/playwright-stat.html

@@ -0,0 +1,6 @@
+<div class="min-w-min py-2 px-12 @md:px-2 text-xs text-left @md:text-center border border-outline first:rounded-t-md last:rounded-b-md @md:first:rounded-tr-none @md:first:rounded-l-md @md:last:rounded-bl-none @md:last:rounded-r-md">
+  <span>{{ include.label }}</span> 
+  <span class="ml-2 min-w-4 px-2 inline @sm:block @md:inline text-center bg-highlight border border-transparent rounded-3xl">
+    {{ include.value }}
+  </span>
+</div>

data/_includes/playwright-summary.html

@@ -0,0 +1,51 @@
+{% if include.data %}
+	<!-- use the custom normalize_playwright filter to get the status, total number of tests, errors, and test statistics from the data -->
+	{% assign results = include.data | normalize_playwright %}
+	<!-- if the data was included, display the summary -->
+	<div class="@container flex flex-col mb-8">
+		<div class="mt-4 py-1 @sm:py-2 px-2 @sm:px-4 font-light text-[0.6rem] @sm:text-xs text-tertiary border border-outline border-b-0 rounded-t-md bg-highlight flex flex-row justify-between">
+			<!-- if the run_id was included, display it in the header of the summary -->
+			{% if include.run_id %}
+				<!-- capture also creates strings with variables, create the url back to the run -->
+				{% capture run_link %}{{ site.github_url }}/actions/runs/{{ include.run_id }}{% endcapture %}
+				<!-- no relative_url necessary here because the link it outside of the app -->
+				<span>Run Id: <a href="{{ run_link }}" target="_blank">{{ include.run_id }}</a></span>
+			{% else %}
+				<span></span>
+			{% endif %}
+			<!-- Liquid provides a helper method for formatting dates -->
+			<span>Run At: {{ results.startTime | date: "%Y-%m-%d %H:%M %Z" }}</span>
+		</div>
+		<div class="pt-2 @sm:pt-4 pb-1 @sm:pb-2 text-xs @sm:text-sm leading-normal border border-outline rounded-b-md flex items-center justify-around">
+			<!-- style the icon according to the report status and use the custom status_icon filter to return the correct svg -->
+			<span class="w-10 @sm:w-12 h-10 @sm:h-12 {{results.status}}">{{ results.status | status_icon }}</span>
+			<div class="py-1 @md:py-2 w-2/3 @sm:w-4/5">
+				{% if results.status == "warn" %}
+					<!-- if there are errors, there won't be any test statistics, so only display the errors -->
+					<div class="py-1 @md:py-2 px-0 font-mono flex flex-col gap-4">
+					{% for error in results.errors %}
+						<!-- loop through the errors and display the messages -->
+						<div class="py-1 @md:py-2 px-2 @md:px-4 border rounded-md border-outline flex flex-wrap">{{ error.message }}</div>
+					{% endfor %}
+					</div>
+				{% else %}
+					<!-- if there are no errors, display the test statistics -->
+					<div class="min-w-full font-medium leading-8 grid grid-cols-1 grid-rows-5 @lg:grid-cols-5 @lg:grid-rows-1 justify-center">
+						{% include playwright-stat.html label="All" value=results.total %}
+						{% include playwright-stat.html label="Passed" value=results.expected %}
+						{% include playwright-stat.html label="Failed" value=results.unexpected %}
+						{% include playwright-stat.html label="Flaky" value=results.flaky %}
+						{% include playwright-stat.html label="Skipped" value=results.skipped %}
+					</div>
+				{% endif %}
+
+				<!-- Liquid provides a helper method that will create the link relative to the baseurl set in _config.yml -->
+				<span class="pt-1 @sm:pt-2 float-right min-h-4 text-xs @sm:text-sm"><a href="{{ include.url | relative_url }}" target="_blank">View Full Report</a></span>
+			</div>
+		</div>
+	</div>
+{% else %}
+	<!-- if the data was not included, display a message that there is nothing to display -->
+
+	<div>There is currently no report for {{ include.branch }}</div>
+{% endif %}

data/_includes/release-note.html

@@ -0,0 +1,29 @@
+<article class="@container border border-outline rounded-sm p-4 my-8">
+  <header class="block mb-8">
+    <a class="text-primary font-semibold leading-14" href="{{ include.post.html_url }}">
+      <h1 class="text-3xl md:text-4xl font-semibold leading-14">{{ include.post.tag | escape }}</h1>
+    </a>
+    <div class="text-sm text-tertiary border-b border-outline pb-6 leading-normal break-words flex flex-row flex-wrap items-end">
+      <div class="mr-6 mb-2">
+        {% if include.post.author_avatar %}
+          <img class="h-5 w-5 rounded-sm inline-block box-border leading-none overflow-hidden align-middle" src="{{ include.post.author_avatar }}" alt="@{{ include.post.author }}" />
+        {% endif %}
+        {% if include.post.author_link %}
+          <a class="decoration-inherit text-current font-bold" href="{{ include.post.author_link }}">{{ include.post.author }}</a>
+        {% else %}
+          <span class="font-bold">{{ include.post.author }}</span>
+        {% endif %}
+        released this
+        {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
+        {% assign pdate = include.post.published_at | date_to_xmlschema %}
+        <time datetime="{{ pdate }}">
+          {{ pdate | date: date_format }}
+        </time>
+      </div>
+    </div>
+  </header>
+
+  <div class="gh-markdown-content mb-8">
+    {{ include.content }}
+  </div>
+</article>

data/_layouts/default.html

@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang | default: site.lang | default: "en" }}">
+
+  {%- include head.html -%}
+
+  <body>
+
+    {%- include header.html -%}
+
+    <main class="py-8" aria-label="Content">
+      <div class="wrapper">
+        {{ content }}
+      </div>
+    </main>
+
+    {%- include footer.html -%}
+
+  </body>
+
+</html>

data/_layouts/page.html

@@ -0,0 +1,14 @@
+---
+layout: default
+---
+<article>
+
+  <header class="mb-8">
+    <h1 class="tracking-[-1px] leading-none">{{ page.title | escape }}</h1>
+  </header>
+
+  <div class="mb-8">
+    {{ content }}
+  </div>
+
+</article>

data/_layouts/playwright-branch.html

@@ -0,0 +1,17 @@
+---
+layout: page
+---
+
+<!-- use the custom key_list filter to get the run ids for the branch and sort them by newest to oldest -->
+{% assign run_ids = site.data.playwright-reports.branches[page.branch] | key_list | reverse %}
+{% for run_id in run_ids %}
+  <!-- loop through the run ids -->
+  {% assign data = site.data.playwright-reports.branches[page.branch][run_id] %}
+  <!-- capture creates a link using the page.branch variable and the run id -->
+  {% capture report_link %}/playwright-reports/branches/{{page.branch}}/{{run_id}}.html{% endcapture %}
+  <!--
+    Include the html snippet in `_includes/playwright-summary.html` with the parameters the `page.branch` variable as `branch`,
+    the `run_id` variable as `run_id`, the `data` variable as `data`, and the `report_link` variable as `url`.
+  -->
+  {% include playwright-summary.html branch=page.branch run_id=run_id data=data url=report_link %}
+{% endfor %}

data/_layouts/post.html

@@ -0,0 +1,25 @@
+---
+layout: default
+---
+<article>
+
+  <header class="mb-8">
+    <h1 class="tracking-[-1px] leading-none">{{ page.title | escape }}</h1>
+    
+    <p class="text-sm text-tertiary">
+      <time datetime="{{ page.date | date_to_xmlschema }}">
+        {%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%}
+        {{ page.date | date: date_format }}
+      </time>
+      {%- if page.author -%}
+        • <span>{{ page.author }}</span>
+      {%- endif -%}
+    </p>
+  </header>
+
+  <div class="mb-8">
+    {{ content }}
+  </div>
+
+  <a class="u-url" href="{{ page.url | relative_url }}" hidden></a>
+</article>

data/_layouts/release-note.html

@@ -0,0 +1,7 @@
+---
+layout: page
+---
+
+{% include release-note.html post=page content=content %}
+
+<a class="u-url" href="{{ page.url | relative_url }}" hidden></a>

data/_plugins/coverage-results-filter.rb

@@ -0,0 +1,15 @@
+module Jekyll
+  module CoverageResultFilter
+    def coverage_status(input, name)
+      if input >= @context.registers[:site].data["coverage"]["thresholds"]["pass"][name]
+        "pass"
+      elsif input >= @context.registers[:site].data["coverage"]["thresholds"]["fail"][name]
+        "warn"
+      else
+        "fail"
+      end
+    end
+  end
+end
+
+Liquid::Template.register_filter(Jekyll::CoverageResultFilter)

data/_plugins/icon-filter.rb

@@ -0,0 +1,22 @@
+module Jekyll
+  module IconFilter
+    def status_icon(input)
+      case input
+      when "pass"
+        "<svg aria-hidden='true' fill='currentColor' height='100%' width='100%' viewBox='0 0 16 16' version='1.1'>
+	        <path fillRule='evenodd' d='M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z'></path>
+        </svg>"
+      when "fail"
+        "<svg aria-hidden='true' fill='currentColor' height='100%' width='100%' viewBox='0 0 16 16' version='1.1'>
+          <path fillRule='evenodd' d='M3.72 3.72a.75.75 0 011.06 0L8 6.94l3.22-3.22a.75.75 0 111.06 1.06L9.06 8l3.22 3.22a.75.75 0 11-1.06 1.06L8 9.06l-3.22 3.22a.75.75 0 01-1.06-1.06L6.94 8 3.72 4.78a.75.75 0 010-1.06z'></path>
+        </svg>"
+      when "warn"
+        "<svg aria-hidden='true' fill='currentColor' height='100%' width='100%' viewBox='0 0 16 16' version='1.1'>
+          <path fillRule='evenodd' d='M8.22 1.754a.25.25 0 00-.44 0L1.698 13.132a.25.25 0 00.22.368h12.164a.25.25 0 00.22-.368L8.22 1.754zm-1.763-.707c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0114.082 15H1.918a1.75 1.75 0 01-1.543-2.575L6.457 1.047zM9 11a1 1 0 11-2 0 1 1 0 012 0zm-.25-5.25a.75.75 0 00-1.5 0v2.5a.75.75 0 001.5 0v-2.5z'></path>
+        </svg>"
+      end
+    end
+  end
+end
+
+Liquid::Template.register_filter(Jekyll::IconFilter)

data/_plugins/key-list-filter.rb

@@ -0,0 +1,14 @@
+module Jekyll
+  module KeyFilter
+    def key_list(input)
+      return if input.nil?
+      keys = []
+      input.each_key do |key|
+        keys.push(key)
+      end
+      keys
+    end
+  end
+end
+
+Liquid::Template.register_filter(Jekyll::KeyFilter)

data/_plugins/playwright-branch-index-generator.rb

@@ -0,0 +1,28 @@
+module Jekyll
+  class BranchIndex < Page
+    def initialize(site, base, dir, branch)
+      @site = site
+      @base = base
+      @dir = dir
+      @name = 'index.html'
+			
+      self.process(@name)
+      self.read_yaml(File.join(base, '_layouts'), 'playwright-branch.html')
+      self.data['branch'] = branch
+    end
+  end
+
+  class BranchIndexGenerator < Generator
+    safe true
+
+    def generate(site)
+      if site.layouts.key? 'playwright-branch'
+        dir = "/playwright-reports/branches"
+        site.data["playwright-reports"]["branches"].each_key do |branch|
+          Jekyll.logger.info "Branch Index: Generating index for #{branch}"
+          site.pages << BranchIndex.new(site, site.source, File.join(dir, branch), branch)
+        end
+      end
+    end
+  end
+end

data/_plugins/playwright-results-filter.rb

@@ -0,0 +1,36 @@
+module Jekyll
+	module PlaywrightResultFilter
+		def normalize_playwright(input)
+			status = playwright_status(input)
+			total = playwright_total(input)
+			stats = input["stats"]
+			stats["errors"] = input["errors"]
+			stats["total"] = total
+			stats["status"] = status
+			stats
+		end
+
+		def playwright_total(input)
+			if input["errors"].size > 0
+				0
+			else
+				input["stats"]["expected"] + input["stats"]["unexpected"] + input["stats"]["skipped"] + input["stats"]["flaky"]
+			end
+		end
+
+		def playwright_status(input)
+			if input["stats"]["unexpected"] > 0
+				# if the unexpected results is greater than one, return fail
+				"fail"
+			elsif input["errors"].size == 0
+				# if there are no unexpected results and no errors, return pass
+				"pass"
+			else
+				# otherwise if there are errors, return error
+				"warn"
+			end
+		end
+	end
+end
+
+Liquid::Template.register_filter(Jekyll::PlaywrightResultFilter)

data/assets/css/styles.css

@@ -0,0 +1,292 @@
+---
+# This yaml frontmatter is required for jekyll to process the file
+---
+
+@import "tailwindcss";
+
+@layer utilities {
+}
+
+@theme {
+  --color-primary: var(--color-gray-900);
+  --color-secondary: var(--color-gray-700);
+  --color-tertiary: var(--color-gray-500);
+
+  --color-light-primary: #fdfdfd;
+  --color-highlight: var(--color-gray-100);
+  --color-outline: var(--color-gray-300);
+
+  --breakpoint-sm: 40rem; /* 640px */
+  --breakpoint-md: 48rem; /* 768px */
+  --breakpoint-lg: 64rem; /* 1024px */
+  --breakpoint-xl: 80rem; /* 1280px */
+  --breakpoint-2xl: 96rem; /* 1536px */
+
+  --font-body:
+    ui-sans-serif, system-ui, sans-serif, Helvetica, Roboto,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+@layer components {
+  body {
+    color: var(--color-primary);
+    background-color: var(--color-light-primary);
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6,
+  p,
+  blockquote,
+  pre,
+  ul,
+  ol,
+  dl,
+  figure {
+    margin-bottom: 15px;
+  }
+
+  main {
+    display: block;
+  }
+
+  img {
+    max-width: 100%;
+    vertical-align: middle;
+  }
+
+  a {
+    color: var(--color-sky-700);
+    text-decoration: none;
+  }
+
+  a:visited {
+    color: var(--color-sky-900);
+    text-decoration: none;
+  }
+
+  a:hover {
+    text-decoration: underline;
+  }
+
+  h1 {
+    font-size: 36px;
+  }
+
+  h2 {
+    font-size: 28px;
+  }
+
+  h3 {
+    font-size: 22px;
+  }
+
+  h4 {
+    font-size: 18px;
+  }
+
+  @media (width >= 40rem) {
+    h1 {
+      font-size: 42px;
+    }
+
+    h2 {
+      font-size: 32px;
+    }
+
+    h3 {
+      font-size: 26px;
+    }
+
+    h4 {
+      font-size: 20px;
+    }
+  }
+
+  table {
+    margin-bottom: 30px;
+    width: 100%;
+    text-align: left;
+    color: var(--color-primary);
+    border-collapse: collapse;
+    border: 1px solid var(--color-outline);
+  }
+  table tr:nth-child(even) {
+    background-color: var(--color-highlight);
+  }
+  table th,
+  table td {
+    padding: 9.999999999px 15px;
+  }
+  table th {
+    background-color: var(--color-highlight);
+    border: 1px solid var(--color-outline);
+    border-bottom-color: var(--color-outline);
+  }
+  table td {
+    border: 1px solid var(--color-outline);
+  }
+
+  ul {
+    list-style-type: disc;
+    margin-left: 30px;
+  }
+
+  li {
+    display: list-item;
+  }
+
+  blockquote {
+    font-size: 1em;
+    font-weight: normal;
+    font-style: normal;
+    border-left-color: var(--color-outline);
+    border-left-style: solid;
+    border-left-width: 4px;
+    box-sizing: border-box;
+    color: var(--color-secondary);
+    display: block;
+    margin-bottom: 1em;
+    overflow-wrap: break-word;
+    padding: 0 1em;
+  }
+
+  p > code {
+    padding: 0.2em 0.4em;
+    margin: 0;
+    font-size: 0.85em;
+    white-space: break-spaces;
+    background-color: var(--color-highlight);
+    border: 1px solid var(--color-highlight);
+    border-radius: 6px;
+  }
+
+  pre {
+    padding: 1em;
+    overflow: auto;
+    font-size: 0.85em;
+    line-height: 1.45em;
+    background-color: var(--color-highlight);
+    border: 1px solid var(--color-highlight);
+    border-radius: 6px;
+    word-wrap: normal;
+    margin-top: 0;
+    margin-bottom: 1rem;
+    box-sizing: border-box;
+
+    > code {
+      display: inline;
+      padding: 0;
+      margin: 0;
+      overflow: visible;
+      line-height: inherit;
+      word-wrap: normal;
+      word-break: normal;
+      white-space: pre;
+      border: 0;
+      background-color: transparent;
+    }
+  }
+
+  .wrapper {
+    max-width: 30rem;
+    margin: 0 auto;
+    padding: 0 1rem;
+
+    @media (width >= 26rem) {
+      max-width: 24rem; /* 384px, container @sm */
+    }
+    @media (width >= 40rem) {
+      max-width: 36rem; /* 576px, container @xl */
+    }
+    @media (width >= 48rem) {
+      max-width: 42rem; /* 672px, container @2xl */
+    }
+    @media (width >= 64rem) {
+      max-width: 56rem; /* 896px, container @4xl */
+      padding: 0 2rem;
+    }
+  }
+
+  .pass {
+    color: var(--color-green-700);
+  }
+
+  .fail {
+    color: var(--color-red-600);
+  }
+
+  .warn {
+    color: var(--color-amber-400);
+  }
+
+  .gh-markdown-content {
+    width: 100%;
+    overflow-x: auto;
+
+    p,
+    li {
+      word-wrap: break-word;
+      word-break: break-word;
+      overflow-wrap: break-word;
+    }
+
+    table {
+      overflow: auto;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+      margin-top: 1.5rem;
+      margin-bottom: 1rem;
+      font-weight: 600;
+    }
+
+    h1 {
+      font-size: 2rem;
+      line-height: 2.5rem;
+      padding-bottom: 0.6rem;
+      border-bottom: 1px solid var(--color-outline);
+    }
+
+    h2 {
+      font-size: 1.5rem;
+      line-height: 1.25rem;
+      padding-bottom: 0.45rem;
+      border-bottom: 1px solid var(--color-outline);
+    }
+
+    h3 {
+      font-size: 1.25rem;
+      line-height: 1.25rem;
+    }
+
+    h4 {
+      font-size: 1rem;
+      line-height: 1.25rem;
+    }
+
+    h5 {
+      font-size: 0.875rem;
+      line-height: 1.25rem;
+    }
+
+    h6 {
+      font-size: 0.85rem;
+      line-height: 1.25rem;
+      color: var(--color-secondary);
+    }
+  }
+}
+
+@plugin "@tailwindcss/typography";

data/coverage.markdown

@@ -0,0 +1,14 @@
+---
+layout: page
+# the header for the page
+title: "Code Coverage Report"
+# the link to page https://jekyllrb.com/docs/permalinks/
+permalink: coverage-report/
+---
+
+<div>
+  <!-- Get the data from the `total` field in `_data/coverage/coverage-summary.json` and assign it to a variable called `total`. -->
+  {% assign total = site.data.coverage.coverage-summary.total %}
+  <!-- Include the html snippet in `_includes/coverage-summary.html` with the parameters "main" as `branch` and the totals from the data as `total`. -->
+  {% include coverage-summary.html branch="main" total=total %}
+</div>

data/index.markdown

@@ -0,0 +1,48 @@
+---
+layout: default
+---
+
+<div class="md:grid md:grid-cols-3 md:gap-8 md:items-start md:justify-center">
+  <div class="md:col-start-1 md:col-span-2">
+    <div class="">
+      <h2 class="md:mt-0">Main</h2>
+
+      <h3>Code Coverage</h3>
+      <!--
+        Jekyll provides access to YAML, JSON, CSV, and TSV in the `_data` directory using `site.data`. It supports retrieving data nested in directories, files, and objects. https://jekyllrb.com/docs/datafiles/
+    
+        Get the data from the `total` field in `_data/coverage/coverage-summary.json` and assign it to a variable called `total`.
+      -->
+      {% assign total = site.data.coverage.coverage-summary.total %}
+      <!--
+        Jekyll uses includes to create reusable snippets of html code. Data can be passed through to the snippet using parameters. https://jekyllrb.com/docs/includes/
+      
+        Include the html snippet in `_includes/coverage-summary.html` with the parameters "main" as `branch` and the totals from the data as `total`.
+      -->
+      {% include coverage-summary.html branch="main" total=total %}
+
+      <!-- Playwright dashboard added earlier -->
+      <h3>Playwright</h3>
+      <!-- Get the data from `_data/playwright-reports/main.json` and assign it to a variable called `data`. -->
+      {% assign data = site.data.playwright-reports.main %}
+      <!-- Jekyll uses Liquid filters to provide helper functions. https://jekyllrb.com/docs/liquid/filters/ -->
+      <!--
+        Include the html snippet in `_includes/playwright-summary.html` with the parameters "main" as `branch`,
+        the data variable as `data`, and "/playwright-reports/main.html" as `url`.
+      -->
+      {% include playwright-summary.html branch="main" data=data url="/playwright-reports/main.html" %}
+    </div>
+
+    <div class="">
+      <h2>Latest Reports from Branches</h2>
+      <!-- Include the html snippet from `_includes/playwright-branch-list.html` -->
+      {% include playwright-branch-list.html %}
+    </div>
+  </div>
+
+  <div class="md:mt-[-2rem] md:col-start-3">
+    {% for post in site.categories["release"] limit: 3 %}
+      {% include release-note.html post=post content=post.content %}
+    {% endfor %}
+  </div>
+</div>

data/playwright-branches.markdown

@@ -0,0 +1,11 @@
+---
+# the header for the page
+title: "Playwright Reports for Branches"
+# the link to page https://jekyllrb.com/docs/permalinks/
+permalink: playwright-reports/branches/
+---
+
+<div>
+  <!-- Include the html snippet in `_includes/playwright-branch-list.html` -->
+  {% include playwright-branch-list.html %}
+</div>

data/playwright-reports.markdown

@@ -0,0 +1,26 @@
+---
+layout: page
+# the header for the page
+title: "Playwright Reports"
+# the link to page https://jekyllrb.com/docs/permalinks/
+permalink: playwright-reports/
+---
+
+<div>
+  <h2>Main
+</h2>
+  <!-- Get the data from `_data/playwright-reports/main.json` and assign it to a variable called `data`. -->
+{% assign data = site.data.playwright-reports.main %}
+  <!--
+    Include the html snippet in `_includes/playwright-summary.html` with the parameters "main" as `branch`,
+    the data variable as `data`, and "/playwright-reports/main.html" as `url`.
+  -->
+  {% include playwright-summary.html branch="main" data=data url="/playwright-reports/main.html" %}
+
+    <div class="mt-8">
+    <h2>Latest Reports from Branches
+  </h2>
+    <!-- Include the html snippet in `_includes/playwright-branch-list.html` -->
+    {% include playwright-branch-list.html %}
+  </div>
+</div>

data/releases.markdown

@@ -0,0 +1,9 @@
+---
+layout: page
+title: Release Notes
+permalink: releases/
+---
+
+{% for post in site.categories["release"] %}
+  {% include release-note.html post=post content=post.content %}
+{% endfor %}

metadata

@@ -0,0 +1,81 @@
+--- !ruby/object:Gem::Specification
+name: jekyll-report-dashboard
+version: !ruby/object:Gem::Version
+  version: 0.1.0
+platform: ruby
+authors:
+- Tiffany Forkner
+bindir: bin
+cert_chain: []
+date: 2025-03-26 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: bundler
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+email:
+- tforkner@fearless.com
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- 404.html
+- _data/coverage/thresholds.yml
+- _includes/coverage-summary.html
+- _includes/footer.html
+- _includes/head.html
+- _includes/header.html
+- _includes/playwright-branch-list.html
+- _includes/playwright-stat.html
+- _includes/playwright-summary.html
+- _includes/release-note.html
+- _layouts/default.html
+- _layouts/page.html
+- _layouts/playwright-branch.html
+- _layouts/post.html
+- _layouts/release-note.html
+- _plugins/coverage-results-filter.rb
+- _plugins/icon-filter.rb
+- _plugins/key-list-filter.rb
+- _plugins/playwright-branch-index-generator.rb
+- _plugins/playwright-results-filter.rb
+- assets/css/styles.css
+- coverage.markdown
+- index.markdown
+- playwright-branches.markdown
+- playwright-reports.markdown
+- releases.markdown
+homepage: https://github.com/FearlessSolutions/jekyll-report-dashboard
+licenses:
+- MIT
+metadata:
+  plugin_type: theme
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - "~>"
+    - !ruby/object:Gem::Version
+      version: 3.4.2
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.6.3
+specification_version: 4
+summary: Jekyll theme for displaying software project reports (e.g. Playwright reports,
+  code coverage reports, GitHub release notes)
+test_files: []