Skip to content

Latest commit

 

History

3 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Logic Coverage Tool

A web application for analyzing Boolean logic expressions and measuring test coverage. Enter any Boolean expression using standard operators and uppercase variable names — the tool generates the complete truth table and reports three coverage metrics: Predicate Coverage, Clause Coverage, and Combinatorial Coverage.

Built with Next.js 15, React 19, TypeScript, and CSS Modules.


Features

  • Instant truth table generation for any Boolean expression
  • Three coverage metrics displayed with pass/fail status:
    • Predicate Coverage (PC) — does the expression evaluate to both true and false?
    • Clause Coverage (CC) — does each individual variable evaluate to both true and false?
    • Combinatorial Coverage (CoC) — are all 2ⁿ input combinations represented?
  • Per-variable clause coverage breakdown
  • Syntax guide and clickable example expressions
  • Responsive dark-theme UI

Tech Stack

Layer Technology
Framework Next.js 15 (App Router)
UI library React 19
Language TypeScript 5
Styling CSS Modules
Runtime Node.js 18+

Prerequisites

Install the following before cloning:

Tool Minimum version Download
Node.js 18.x https://nodejs.org
npm 9.x (bundled with Node.js) —
Git 2.x https://git-scm.com

Verify your versions:

node -v
npm -v
git --version

Installation

Linux

# 1. Clone the repository
git clone https://github.com/kacytran1122/logic-coverage_tool.git

# 2. Enter the project directory
cd logic-coverage_tool

# 3. Install dependencies
npm install

# 4. Start the development server
npm run dev

Open your browser at http://localhost:3000

Node.js via nvm (recommended on Linux)

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash
source ~/.bashrc
nvm install 20
nvm use 20

macOS

# 1. Clone the repository
git clone https://github.com/kacytran1122/logic-coverage_tool.git

# 2. Enter the project directory
cd logic-coverage_tool

# 3. Install dependencies
npm install

# 4. Start the development server
npm run dev

Open your browser at http://localhost:3000

Node.js via Homebrew (recommended on macOS)

brew install node

Or use nvm as shown in the Linux section above.


Windows

Open PowerShell or Command Prompt:

# 1. Clone the repository
git clone https://github.com/kacytran1122/logic-coverage_tool.git

# 2. Enter the project directory
cd logic-coverage_tool

# 3. Install dependencies
npm install

# 4. Start the development server
npm run dev

Open your browser at http://localhost:3000

Node.js on Windows Download the Windows installer from https://nodejs.org and run it. Git for Windows is available at https://git-scm.com/download/win.


Available Scripts

Command Description
npm run dev Start development server with hot reload at http://localhost:3000
npm run build Create an optimized production build
npm start Serve the production build
npm run lint Run ESLint across the project

Project Structure

logic-coverage_tool/
├── src/
│   ├── app/
│   │   ├── globals.css        # Global CSS variables, resets, animations
│   │   ├── layout.tsx         # Root layout with metadata and font setup
│   │   ├── page.tsx           # Main interactive page (client component)
│   │   └── page.module.css    # Page-level CSS Modules
│   ├── components/
│   │   ├── CoverageCard.tsx         # Coverage metric card (PC / CC / CoC)
│   │   ├── CoverageCard.module.css
│   │   ├── TruthTable.tsx           # Truth table with T/F highlighting
│   │   └── TruthTable.module.css
│   └── lib/
│       └── logicCoverage.ts   # Core analysis logic (pure TypeScript)
├── public/
├── package.json
├── tsconfig.json
├── next.config.ts
└── .gitignore

Usage

Expression Syntax

Symbol Meaning Example
A–Z Variable (uppercase letters only) A, B, C
&& Logical AND A && B
|| Logical OR A || B
! Logical NOT !A
() Grouping (A || B) && C

Example Expressions

A && B
(A || B) && C
A && (B || !C)
(A || B) && (C || D)
!A || (B && C)

Steps

  1. Type a Boolean expression in the input field (or click an example chip).
  2. Press Enter or click Analyze.
  3. Review the three coverage cards — each shows PASS or FAIL.
  4. Scroll down to inspect the full truth table.

Coverage Definitions

Predicate Coverage (PC)

The overall expression must evaluate to both true and false across all test cases. Since the tool generates every possible combination of variable values, PC will always pass unless the expression is a tautology or contradiction.

Clause Coverage (CC)

Every individual variable (clause) in the expression must independently evaluate to both true and false across all test cases. The CC card shows a tag for each variable indicating whether it achieves both values.

Combinatorial Coverage (CoC)

All 2ⁿ possible input combinations (where n is the number of variables) must be present in the test suite. Because the tool generates the complete truth table, CoC always passes. It becomes the relevant metric when testing a subset of cases rather than the full table.


Development Report

Project Background

The Logic Coverage Tool originated as a lightweight, browser-based educational utility built with plain HTML, CSS, and JavaScript. Its purpose was to help students and testers visualize how Boolean expressions behave across all possible inputs and understand the three standard logic coverage criteria used in software testing.

Original Implementation

The original project consisted of five files:

File Role
index.html Page structure and script imports
app.js DOM interaction and truth-table rendering
logicCoverage.js Core coverage logic using eval()
logicCoverage.test.js Four inline tests with a custom assert helper
style.css Minimal dark-theme stylesheet

All four core tests (predicate coverage, clause coverage, combinatorial coverage, expression evaluation) passed on first run. The logic was clean and well-separated from the UI layer. One known issue was a filename mismatch — index.html referenced styles.css while the actual file was named style.css.

Conversion to Next.js

The project was migrated to a modern stack to improve maintainability, type safety, and user experience:

Core logic (src/lib/logicCoverage.ts)

The original logicCoverage.js was rewritten in TypeScript with full interface definitions (TestCase, ClauseCoverage, CoverageResults, AnalysisResult). The eval() call was replaced with a Function constructor call after input sanitization — only uppercase letters, whitespace, &&, ||, !, and () are accepted. A variable limit of 10 was added to prevent generating more than 1,024 rows.

UI (src/app/page.tsx)

The UI was rebuilt as a React client component with:

  • Controlled input with real-time error clearing
  • Async analysis with a 120 ms loading state for visual feedback
  • Clickable example expressions
  • Keyboard shortcut (Enter) to trigger analysis

Components

CoverageCard handles all three coverage types. The CC card maps over the clauseCoverage record and renders a tagged chip per variable. TruthTable renders the complete truth table with row-level true/false tinting and an output count summary.

Styling

CSS Modules replaced the single flat stylesheet. A CSS variable system (--accent, --success, --danger, etc.) was introduced so the color palette is consistent across all components. The layout is fully responsive — the coverage grid collapses to a single column on narrow viewports.

Decisions Made

Decision Reason
CSS Modules over Tailwind Keeps styles co-located with components and avoids a build dependency
Function constructor over eval Allows input sanitization before execution
10-variable cap 2¹⁰ = 1,024 rows is reasonable; beyond that the table becomes unreadable
'use client' on page All state and interaction is client-side; no server data is needed
No external UI library The component count is small enough that a library would add more overhead than value

Test Coverage

The original four test cases validated:

  1. checkPC returns true when both true and false are present in results
  2. checkCC correctly identifies when each variable achieves both values
  3. checkCoC confirms the full 2ⁿ combination count
  4. evaluateExpression evaluates A && B with A=true, B=false to false

These cases map directly to the TypeScript functions in src/lib/logicCoverage.ts and remain valid.


License

This project is open source. See the repository for details.

About

No description, website, or topics provided.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages