Skip to content
cccskills
FreePublished on GitHub

browserstack-live

Open local or public web pages in BrowserStack Live for checks on real mobile devices or desktop browsers. The skill prepares temporary access to a local server, launches the requested session, and shares its dashboard link.

OriginalShow the original description

Use when testing a local or public URL on a real device via BrowserStack, opening a live browser session on Android, iOS, or desktop browsers, or when the user mentions BrowserStack, real device testing, mobile testing, cross-browser testing, touch testing, or wants to verify behavior on a specific phone, tablet, or browser version. Also trigger when the user says "test this on Android/iPhone/Safari/Chrome mobile", asks to open a live session, or mentions demo-mobile.html, even if they don't mention BrowserStack by name.

Works withCloudflare
See how to install

Good for

  • Check a local page on an Android device
  • Open a page in Safari on an iPhone or iPad
  • Inspect behavior in a specific desktop browser
  • Compare a Handsontable local build with its released version

Files included (1)

  • SKILL.md3.7 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

BrowserStack Live Session

BrowserStack devices cannot reach localhost, so tunnel the local dev server through Cloudflare to a temporary public URL: local server -> Cloudflare tunnel (trycloudflare.com) -> BrowserStack Live.

Step 1: Prepare something to test

Option A: Handsontable demo page

Use the handsontable-demo-page skill to generate handsontable/dev-pr.html (local build) and handsontable/dev-latest.html (released version from the CDN); each links to the other. Serve and verify:

python3 -m http.server 8767 --directory handsontable &
curl -s -o /dev/null -w "dev-pr: %{http_code}\n" http://localhost:8767/dev-pr.html && \
curl -s -o /dev/null -w "dev-latest: %{http_code}\n" http://localhost:8767/dev-latest.html

The tunnel path is /dev-pr.html; its nav bar switches to /dev-latest.html.

Option B: Existing local server

Confirm reachability: curl -s -o /dev/null -w "%{http_code}" <URL>

ServerStart commandDefault port
Docs (Astro)npm run dev --prefix docs4321
Handsontable static filespython3 -m http.server 8767 --directory handsontable8767

If a Vite-based server (Astro docs) returns "Blocked request" on the tunnel URL, check whether astro.config.mjs already has this, add it if missing, and restart:

vite: {
  server: {
    allowedHosts: ['.trycloudflare.com'],
  },
}

Option C: Public URL

Skip to Step 3 and pass the URL directly.

Step 2: Start the Cloudflare tunnel

The tunnel needs no Cloudflare account. The URL is printed to stderr, so capture it:

npx cloudflared tunnel --url http://localhost:<PORT> > /tmp/cloudflare-tunnel.log 2>&1 &
echo "Tunnel PID: $!"
sleep 10
grep -o 'https://[a-z0-9-]*\.trycloudflare\.com' /tmp/cloudflare-tunnel.log | head -1

If no URL appears, wait and re-check cat /tmp/cloudflare-tunnel.log; on failure check port conflicts and kill stale tunnel processes. The URL changes on every restart.

Step 3: Launch the BrowserStack session

Call mcp__browserstack__runBrowserLiveSession and share the dashboard URL it returns.

Mobile:

mcp__browserstack__runBrowserLiveSession({
  platformType: "mobile",
  desiredURL: "<tunnel-url>/<path>",
  desiredOS: "android",           // or "ios"
  desiredOSVersion: "latest",
  desiredBrowser: "chrome",       // or "safari" for iOS
  desiredDevice: "Samsung Galaxy S25"
})

Desktop:

mcp__browserstack__runBrowserLiveSession({
  platformType: "desktop",
  desiredURL: "<tunnel-url>/<path>",
  desiredOS: "Windows",           // or "OS X"
  desiredOSVersion: "11",         // or "latest"
  desiredBrowser: "chrome"        // or "firefox", "safari", "edge"
})

Defaults when the user names no device:

User saysDeviceOSBrowser
"test on Android"Samsung Galaxy S25android latestchrome
"Android mid-range"Google Pixel 9android latestchrome
"test on iPhone"iPhone 16ios latestsafari
"test on iPad"iPad Air 6thios latestsafari

Step 4: Cleanup

When testing ends, kill <tunnel-pid> 2>/dev/null and stop any local HTTP server started for the session.

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Develop and modify the Handsontable Angular wrapper with guidance on component lifecycle, settings updates, and NgZone, which controls change detection. It also covers standalone examples, global configuration, and the build and test workflow.

  • Fix settings updates in the Angular wrapper
  • Review change detection around grid operations
  • Update examples to standalone components
handsontable/handsontable22.1KUpdated Oct 19, 2026

Prepare user-facing changelog entries for source code changes. The skill determines whether an entry is needed, classifies the change, writes a clear title, and uses the project CLI to create a JSON file tied to the pull request.

  • Add a changelog entry for a bug fix
  • Classify a new feature or behavior change
  • Explain a breaking change and its replacement
handsontable/handsontable22.1KUpdated Oct 19, 2026

code-graph

FreeSummary

Explore relationships between functions and files using a prebuilt code graph, a map of code dependencies. Trace bugs, inspect callers and execution paths, and assess the impact of refactoring or proposed changes.

  • Explore callers and dependencies in unfamiliar code
  • Trace a bug across multiple files
  • Assess the impact of renaming or removing code
handsontable/handsontable22.1KUpdated Oct 19, 2026

Work with Handsontable row and column positions by distinguishing source data, displayed order, and rendered cells. It guides index conversion and helps investigate misplaced data when sorting, filtering, hiding, or moving rows and columns.

  • Investigating misplaced rows or columns
  • Converting between source and displayed indexes
  • Combining filters with manual column movement
handsontable/handsontable22.1KUpdated Oct 19, 2026

Create Handsontable documentation examples for JavaScript, TypeScript, React, Angular, and Vue. The skill explains source files, generated JavaScript, required imports and license settings, embedding examples in guides, and checking that each framework version displays correctly.

  • Adding a code example to a feature guide
  • Preparing examples for multiple frameworks
  • Generating JavaScript examples from TypeScript
handsontable/handsontable22.1KUpdated Oct 19, 2026

Build Handsontable demo pages for visual regression tests, which compare screenshots for appearance changes. It guides feature routes, URL-driven display states, sample data, and decisions about testing the same feature across framework wrappers.

  • Adding a demo route for a new feature
  • Creating multiple visual states through URL parameters
  • Planning visual coverage across framework wrappers
handsontable/handsontable22.1KUpdated Oct 19, 2026

See all skills by handsontable

Report a problem with this skill