snapexcel 1.2.6 → 1.2.8

package/WALMART_NPM_PUBLISHING_GUIDE.md

@@ -0,0 +1,125 @@
+# Walmart Internal NPM Publishing Guide
+
+## Overview
+Walmart uses **Proximity** (also called Backpack) as its internal npm registry for publishing Node.js packages.
+
+---
+
+## Registry URL
+```
+https://npme.walmart.com
+```
+
+---
+
+## Step 1: Configure .npmrc
+
+Create or update your `.npmrc` file (in project root or `$HOME/.npmrc`):
+
+```
+registry=https://npme.walmart.com
+email=your.email@walmartlabs.com
+```
+
+**Important:** Do NOT include `authToken` in your `.npmrc` for the internal registry.
+
+---
+
+## Step 2: Update package.json with Scope
+
+Walmart requires scoped packages. Use `@walmart` or `@walmartlabs`:
+
+```json
+{
+  "name": "@walmart/snapexcel",
+  "version": "1.2.5",
+  "description": "Desktop Screenshot Logger for UI Testing",
+  "publishConfig": {
+    "registry": "https://npme.walmart.com"
+  }
+}
+```
+
+---
+
+## Step 3: Publishing via Looper (Required)
+
+⚠️ **Manual publishing from local machines is NOT allowed.**
+
+Publishing must be done through **Looper** (Walmart's CI/CD platform):
+
+1. Push your code to gecgithub01.walmart.com
+2. Configure Looper pipeline for npm publish
+3. Looper handles authentication automatically
+
+### Looper Configuration Example (looper.yml):
+```yaml
+pipelines:
+  publish:
+    steps:
+      - npm:
+          command: publish
+          registry: https://npme.walmart.com
+```
+
+---
+
+## Step 4: Best Practices
+
+1. **Always use `package-lock.json`** - Ensures deterministic builds
+2. **Use scoped packages** - `@walmart/` or `@walmartlabs/`
+3. **No manual publishing** - Always use Looper
+4. **Remove authToken lines** - Don't comment them, remove completely
+
+---
+
+## Troubleshooting
+
+### Error: `npm ERR! need auth`
+- You're trying to publish from local machine (not allowed)
+- Your `.npmrc` has an `authToken` line - remove it completely
+
+### Error: Authentication failed
+- Ensure you're using Looper, not local publish
+- Check `.npmrc` configuration
+
+---
+
+## References
+
+- [Using NPM at Walmart](https://dx.walmart.com/proximity/documentation/dx/Using-NPM-D7drllinbbb)
+- [NPM Best Practices](https://dx.walmart.com/artifactory/documentation/confluence/NPM-Best-Practices-2555353509)
+- [Proximity FAQs](https://dx.walmart.com/proximity/documentation/dx/Proximity-FAQs-Dg9qp321adg)
+
+---
+
+## Quick Summary
+
+| Item | Value |
+|------|-------|
+| Registry URL | `https://npme.walmart.com` |
+| Scope | `@walmart` or `@walmartlabs` |
+| Publishing | Via Looper only (not local) |
+| Auth | Handled by Looper automatically |
+
+---
+
+## For SnapExcel
+
+To publish SnapExcel to Walmart's internal registry:
+
+1. Update `package.json`:
+```json
+{
+  "name": "@walmart/snapexcel",
+  "publishConfig": {
+    "registry": "https://npme.walmart.com"
+  }
+}
+```
+
+2. Push to gecgithub01.walmart.com
+3. Set up Looper pipeline for publishing
+4. Looper will handle the rest
+
+**Note:** You cannot publish from your local machine to Walmart's registry.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "snapexcel",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "description": "Desktop Screenshot Logger for UI Testing - Capture any window including Android emulators",
   "main": "src/main.js",
   "bin": {

package/publish.sh

@@ -0,0 +1,5 @@
+#!/bin/bash
+
+# SnapExcel - Publish to npm script
+
+git add . && git commit -m "fix: responsive layout, prevent focus stealing, UI improvements" && npm version patch && npm publish

package/src/index.html

@@ -103,11 +103,11 @@
       <!-- Keyboard Shortcuts -->
       <div class="shortcut-hint">
         <div class="shortcut-item">
-          <span class="shortcut-key">⌘⇧S</span>
+          <span class="shortcut-key">⌘⇧A</span>
           <span class="shortcut-label">Fullscreen</span>
         </div>
         <div class="shortcut-item">
-          <span class="shortcut-key">⌘⇧A</span>
+          <span class="shortcut-key">⌘⇧S</span>
           <span class="shortcut-label">Region</span>
         </div>
       </div>

package/src/main.js

@@ -29,13 +29,13 @@ function createWindow() {
 
   mainWindow.loadFile(path.join(__dirname, 'index.html'));
 
-  // Register global shortcut for capture (Cmd/Ctrl + Shift + S)
-  globalShortcut.register('CommandOrControl+Shift+S', () => {
+  // Register global shortcut for fullscreen capture (Cmd/Ctrl + Shift + A for All)
+  globalShortcut.register('CommandOrControl+Shift+A', () => {
     mainWindow.webContents.send('trigger-capture');
   });
 
-  // Register global shortcut for region capture (Cmd/Ctrl + Shift + A for Area)
-  globalShortcut.register('CommandOrControl+Shift+A', () => {
+  // Register global shortcut for region capture (Cmd/Ctrl + Shift + S for Select)
+  globalShortcut.register('CommandOrControl+Shift+S', () => {
     mainWindow.webContents.send('trigger-region-capture');
   });
 
@@ -195,16 +195,20 @@ ipcMain.handle('start-region-capture', async () => {
         regionWindow.webContents.send('set-background', fullScreenshot, display.size);
       });
 
-      // Function to restore main window properly
+      // Function to restore main window without stealing focus
       const restoreMainWindow = () => {
-        if (mainWindow && mainWindowBounds) {
-          // Use setTimeout to let the region window fully close first
+        if (mainWindow) {
+          // Just restore the window state without bringing it to foreground
+          // This prevents pulling user to SnapExcel window when they're on different screen
           setTimeout(() => {
-            mainWindow.restore();
-            mainWindow.setSize(mainWindowBounds.width, mainWindowBounds.height);
-            mainWindow.setPosition(mainWindowBounds.x, mainWindowBounds.y);
-            // Don't focus - let user continue with their app
-            mainWindow.blur();
+            if (mainWindow.isMinimized()) {
+              // Use showInactive to restore without stealing focus
+              mainWindow.showInactive();
+            }
+            // Don't change size/position - keep window where it was
+            if (isAlwaysOnTop) {
+              mainWindow.setAlwaysOnTop(true);
+            }
           }, 100);
         }
       };

package/src/renderer.js

@@ -733,6 +733,9 @@ async function captureScreenshot() {
 
       state.sheets[state.currentSheetIndex].screenshots.push(screenshot);
       saveState();
+
+      // Small delay to let window fully restore before updating UI
+      await new Promise(resolve => setTimeout(resolve, 100));
       updateUI();
       lastCaptureTime = Date.now();
 
@@ -798,6 +801,10 @@ async function captureRegion() {
 
       state.sheets[state.currentSheetIndex].screenshots.push(screenshot);
       saveState();
+
+      // Small delay to let window fully restore before updating UI
+      await new Promise(resolve => setTimeout(resolve, 100));
+
       // Don't call updateUI() which might resize the window - just update the grid
       updateScreenshotsGrid(state.sheets[state.currentSheetIndex].screenshots);
       elements.screenshotCount.textContent = state.sheets[state.currentSheetIndex].screenshots.length;

package/src/styles.css

@@ -47,8 +47,7 @@ body {
 .app-container {
   display: flex;
   flex-direction: column;
-  min-height: 100vh;
-  max-height: 100vh;
+  height: 100vh;
   overflow: hidden;
 }
 
@@ -159,7 +158,9 @@ body {
   display: flex;
   flex-direction: column;
   overflow-y: auto;
+  overflow-x: hidden;
   padding: 16px;
+  flex: 1;
 }
 
 .view.hidden {
@@ -534,6 +535,9 @@ body {
   border-radius: 5px;
   border: 0.5px solid rgba(4, 30, 66, 0.04);
   padding: 5px;
+  flex: 1;
+  min-height: 100px;
+  overflow: hidden;
 }
 
 .section-header {
@@ -559,14 +563,16 @@ body {
 
 .screenshots-grid {
   display: grid;
-  grid-template-columns: repeat(4, 1fr);
+  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
+  grid-auto-rows: min-content;
+  align-content: start;
   gap: 8px;
   overflow-y: auto;
   padding: 5px;
   background: rgba(255, 255, 255, 0.5);
   border-radius: 3px;
+  flex: 1;
   min-height: 70px;
-  max-height: 200px;
 }
 
 /* Ultra thin scrollbar - both vertical and horizontal */