npm - gh-here - Versions diffs - 3.0.1 → 3.0.3 - Mend

gh-here 3.0.1 → 3.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/README.md CHANGED Viewed

@@ -62,6 +62,20 @@ npm install
 npm start
 ```
+### Running Tests (Optional)
+Tests use Playwright for smoke testing but are optional for development:
+```bash
+# First time only - install Chromium for testing (~210MB)
+npx playwright install chromium
+# Run tests
+npm test
+```
+**Note**: End users don't need Playwright - it's only installed when you clone the repo and run `npm install` (devDependency).
 ## Dependencies
 - express - Web server

package/lib/renderers.js CHANGED Viewed

@@ -103,7 +103,7 @@ function renderDirectory(currentPath, items, showGitignored = false, gitBranch =
     <html data-theme="dark">
     <head>
       <title>gh-here: ${currentPath || 'Root'}</title>
-      <link rel="stylesheet" href="/static/styles.css?v=${Date.now()}">
+      <link rel="stylesheet" href="/static/styles.css?v=3.0.5">
       <script>
         // Check localStorage and add showGitignored param if needed (before page renders)
         (function() {
@@ -306,18 +306,18 @@ function generateLanguageStats(items) {
 async function renderFileDiff(filePath, ext, gitInfo, gitRepoRoot, workingDir = null, gitBranch = null) {
   const workingDirName = workingDir ? path.basename(workingDir) : null;
   const breadcrumbs = generateBreadcrumbs(filePath, null, workingDirName);
   // Get git diff for the file
   return new Promise((resolve, reject) => {
-    const diffCommand = gitInfo.staged ?
-      `git diff --cached "${filePath}"` :
+    const diffCommand = gitInfo.staged ?
+      `git diff --cached "${filePath}"` :
       `git diff "${filePath}"`;
-    exec(diffCommand, { cwd: gitRepoRoot }, (error, stdout) => {
+    exec(diffCommand, { cwd: gitRepoRoot }, (error, stdout, stderr) => {
       if (error) {
         return reject(error);
       }
       const diffContent = renderRawDiff(stdout, ext);
       const currentParams = new URLSearchParams({ path: filePath });
       const viewUrl = `/?${currentParams.toString()}`;
@@ -407,7 +407,7 @@ async function renderFileDiff(filePath, ext, gitInfo, gitRepoRoot, workingDir =
         <html data-theme="dark">
         <head>
           <title>gh-here: ${path.basename(filePath)} (diff)</title>
-          <link rel="stylesheet" href="/static/styles.css?v=${Date.now()}">
+          <link rel="stylesheet" href="/static/styles.css?v=3.0.5">
           <link rel="stylesheet" href="/static/highlight.css?v=${Date.now()}">
           <script>
             // Check localStorage and add showGitignored param if needed (before page renders)
@@ -787,7 +787,7 @@ async function renderFile(filePath, content, ext, viewMode = 'rendered', gitStat
     <html data-theme="dark">
     <head>
       <title>gh-here: ${path.basename(filePath)}</title>
-      <link rel="stylesheet" href="/static/styles.css?v=${Date.now()}">
+      <link rel="stylesheet" href="/static/styles.css?v=3.0.5">
       <link rel="stylesheet" href="/static/highlight.css?v=${Date.now()}">
       <script>
         // Check localStorage and add showGitignored param if needed (before page renders)

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "gh-here",
-  "version": "3.0.1",
+  "version": "3.0.3",
   "description": "A local GitHub-like file browser for viewing code",
   "repository": {
     "type": "git",
@@ -12,7 +12,7 @@
   },
   "scripts": {
     "start": "node bin/gh-here.js",
-    "test": "echo yolo no tests yet"
+    "test": "node test.js"
   },
   "keywords": [
     "github",
@@ -23,9 +23,12 @@
   "author": "",
   "license": "MIT",
   "dependencies": {
+    "@primer/octicons": "^19.8.0",
     "express": "^4.18.2",
     "highlight.js": "^11.9.0",
-    "marked": "^12.0.0",
-    "@primer/octicons": "^19.8.0"
+    "marked": "^12.0.0"
+  },
+  "devDependencies": {
+    "playwright": "^1.56.1"
   }
 }

package/public/app.js CHANGED Viewed

@@ -19,6 +19,7 @@ class Application {
     this.keyboardHandler = null;
     this.fileTree = null;
     this.navigationHandler = null;
+    this.lastSelectedLine = null;
   }
   init() {
@@ -35,15 +36,15 @@ class Application {
         if (this.themeManager) {
           this.themeManager.setupListeners();
         }
         // Re-initialize components that need fresh DOM references
         this.searchHandler = new SearchHandler();
         this.keyboardHandler = new KeyboardHandler(this.searchHandler);
         // Re-initialize file tree when sidebar becomes visible
         const sidebar = document.querySelector('.file-tree-sidebar');
         const treeContainer = document.getElementById('file-tree');
         if (sidebar && treeContainer && !sidebar.classList.contains('hidden')) {
           // Sidebar is visible - initialize or re-initialize file tree
           if (!this.fileTree || !this.fileTree.isInitialized || this.fileTree.treeContainer !== treeContainer) {
@@ -53,10 +54,11 @@ class Application {
           // Sidebar is hidden - don't initialize but keep reference for when it becomes visible
           this.fileTree = null;
         }
         this.setupGlobalEventListeners();
         this.setupGitignoreToggle();
         this.setupFileOperations();
+        this.highlightLinesFromHash();
       } catch (error) {
         console.error('Error re-initializing components:', error);
       }
@@ -72,7 +74,7 @@ class Application {
     // Initialize components
     this.searchHandler = new SearchHandler();
     this.keyboardHandler = new KeyboardHandler(this.searchHandler);
     // Initialize file tree if sidebar is visible (not hidden)
     const sidebar = document.querySelector('.file-tree-sidebar');
     const treeContainer = document.getElementById('file-tree');
@@ -83,6 +85,7 @@ class Application {
     this.setupGlobalEventListeners();
     this.setupGitignoreToggle();
     this.setupFileOperations();
+    this.highlightLinesFromHash();
   }
   setupGlobalEventListeners() {
@@ -104,6 +107,16 @@ class Application {
   }
   handleGlobalClick(e) {
+    // Line number selection (like GitHub)
+    const lineNumber = e.target.closest('.line-number');
+    if (lineNumber) {
+      e.preventDefault();
+      e.stopPropagation();
+      const lineNum = parseInt(lineNumber.textContent.trim(), 10);
+      this.handleLineSelection(lineNum, e.shiftKey);
+      return;
+    }
     // Copy path button
     const copyPathBtn = e.target.closest('.copy-path-btn, .file-path-copy-btn');
     if (copyPathBtn) {
@@ -264,6 +277,61 @@ class Application {
       showNotification('Failed to copy raw content', 'error');
     }
   }
+  handleLineSelection(lineNum, shiftKey) {
+    // If shift is held and we have a previous selection, select range
+    if (shiftKey && this.lastSelectedLine) {
+      const start = Math.min(this.lastSelectedLine, lineNum);
+      const end = Math.max(this.lastSelectedLine, lineNum);
+      this.highlightLines(start, end);
+      this.updateUrlHash(start, end);
+    } else {
+      // Single line selection
+      this.highlightLines(lineNum, lineNum);
+      this.updateUrlHash(lineNum, lineNum);
+      this.lastSelectedLine = lineNum;
+    }
+  }
+  highlightLines(start, end) {
+    // Clear all existing selections and highlight new range in one pass
+    document.querySelectorAll('.line-container').forEach(el => {
+      const lineNum = parseInt(el.dataset.line, 10);
+      if (lineNum >= start && lineNum <= end) {
+        el.classList.add('selected');
+      } else {
+        el.classList.remove('selected');
+      }
+    });
+  }
+  updateUrlHash(start, end) {
+    const hash = start === end ? `L${start}` : `L${start}-L${end}`;
+    // Use history API to update URL without scrolling - preserve path and query params
+    const url = new URL(window.location);
+    url.hash = hash;
+    history.replaceState(null, null, url);
+  }
+  highlightLinesFromHash() {
+    const hash = window.location.hash.slice(1); // Remove #
+    if (!hash.startsWith('L')) return;
+    const match = hash.match(/^L(\d+)(?:-L(\d+))?$/);
+    if (!match) return;
+    const start = parseInt(match[1], 10);
+    const end = match[2] ? parseInt(match[2], 10) : start;
+    this.highlightLines(start, end);
+    this.lastSelectedLine = start;
+    // Scroll to the first selected line
+    const firstLine = document.querySelector(`.line-container[data-line="${start}"]`);
+    if (firstLine) {
+      firstLine.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    }
+  }
 }
 const app = new Application();

package/public/js/navigation.js CHANGED Viewed

@@ -35,6 +35,11 @@ export class NavigationHandler {
     const link = e.target.closest('a');
     if (!link) return;
+    // Skip line number links (hash-only navigation like #L10)
+    if (link.classList.contains('line-number')) {
+      return;
+    }
     // Skip if clicking inside quick actions or other interactive elements
     if (e.target.closest('.quick-actions, button, .file-action-btn')) {
       return;

package/public/styles.css CHANGED Viewed

@@ -120,7 +120,16 @@ header {
   font-weight: 600;
   margin: 0;
   color: var(--text-primary);
-  letter-spacing: -0.01em;
+  letter-spacing: 0.02em;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+}
+.header-left h1::before {
+  content: '$';
+  color: var(--link-color);
+  margin-right: 8px;
+  opacity: 0.8;
+  font-weight: 400;
 }
 .header-path {
@@ -1623,7 +1632,7 @@ main {
 .line-content {
   white-space: pre;
-  display: inline-block;
+  display: inline;
   padding: 0 10px;
   font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
   font-size: 12px;

package/test.js ADDED Viewed

@@ -0,0 +1,138 @@
+/**
+ * Lightweight smoke tests for gh-here
+ * Run with: node test.js
+ */
+const { chromium } = require('playwright');
+const { spawn } = require('child_process');
+const TEST_PORT = 5556; // Use different port to avoid conflicts
+const BASE_URL = `http://localhost:${TEST_PORT}`;
+async function sleep(ms) {
+  return new Promise(resolve => setTimeout(resolve, ms));
+}
+async function runTests() {
+  console.log('Starting gh-here server...');
+  // Start server
+  const server = spawn('node', ['bin/gh-here.js', `--port=${TEST_PORT}`], {
+    cwd: __dirname,
+    stdio: 'pipe'
+  });
+  // Wait for server to start
+  await sleep(2000);
+  let browser;
+  let failures = 0;
+  try {
+    console.log('Launching browser...');
+    browser = await chromium.launch({ headless: true });
+    const context = await browser.newContext();
+    const page = await context.newPage();
+    // Test 1: Root page loads
+    console.log('\n✓ Test 1: Root page loads');
+    await page.goto(BASE_URL);
+    const title = await page.title();
+    if (!title.includes('gh-here')) {
+      console.error('  ✗ FAILED: Page title incorrect');
+      failures++;
+    }
+    // Test 2: File tree exists (may be hidden on root)
+    console.log('✓ Test 2: File tree element exists');
+    const fileTreeExists = await page.$('#file-tree');
+    if (!fileTreeExists) {
+      console.error('  ✗ FAILED: File tree element not found');
+      failures++;
+    }
+    // Test 3: Navigate to a file and check line numbers display correctly
+    console.log('✓ Test 3: File view with line numbers');
+    await page.goto(`${BASE_URL}/?path=lib/renderers.js`);
+    await page.waitForSelector('.line-container', { timeout: 5000 });
+    // Check that line numbers are in a vertical column (not nested)
+    const lineContainers = await page.$$('.line-container');
+    if (lineContainers.length < 10) {
+      console.error('  ✗ FAILED: Not enough line containers found');
+      failures++;
+    }
+    // Check line 1 and line 2 have sequential numbers
+    const line1 = await page.$('.line-container[data-line="1"]');
+    const line2 = await page.$('.line-container[data-line="2"]');
+    if (!line1 || !line2) {
+      console.error('  ✗ FAILED: Line containers missing data-line attributes');
+      failures++;
+    }
+    // Verify line numbers are not nested (check display property)
+    const line1Display = await page.$eval('.line-container[data-line="1"]',
+      el => window.getComputedStyle(el).display
+    );
+    if (line1Display !== 'block') {
+      console.error(`  ✗ FAILED: Line containers should have display:block, got ${line1Display}`);
+      failures++;
+    }
+    // Test 4: Check if modified files show diff button
+    console.log('✓ Test 4: Modified files show diff button');
+    await page.goto(BASE_URL);
+    const diffButtons = await page.$$('.diff-btn');
+    // Should have at least one diff button if there are modified files
+    console.log(`  Found ${diffButtons.length} diff buttons`);
+    // Test 5: Gitignore toggle exists and is clickable
+    console.log('✓ Test 5: Gitignore toggle button');
+    const gitignoreToggle = await page.$('#gitignore-toggle');
+    if (!gitignoreToggle) {
+      console.error('  ✗ FAILED: Gitignore toggle button not found');
+      failures++;
+    }
+    // Test 6: Theme toggle works
+    console.log('✓ Test 6: Theme toggle');
+    const themeToggle = await page.$('#theme-toggle');
+    if (!themeToggle) {
+      console.error('  ✗ FAILED: Theme toggle button not found');
+      failures++;
+    }
+    // Test 7: Search functionality
+    console.log('✓ Test 7: Search input exists');
+    const searchInput = await page.$('#file-search, #root-file-search');
+    if (!searchInput) {
+      console.error('  ✗ FAILED: Search input not found');
+      failures++;
+    }
+    console.log('\n' + '='.repeat(50));
+    if (failures === 0) {
+      console.log('✓ All tests passed!');
+    } else {
+      console.log(`✗ ${failures} test(s) failed`);
+    }
+    console.log('='.repeat(50) + '\n');
+  } catch (error) {
+    console.error('\n✗ Test failed with error:', error.message);
+    failures++;
+  } finally {
+    if (browser) {
+      await browser.close();
+    }
+    // Kill server
+    server.kill();
+    // Exit with appropriate code
+    process.exit(failures > 0 ? 1 : 0);
+  }
+}
+runTests();