Skip to content

Instantly share code, notes, and snippets.

@munrocket
Last active October 23, 2022 19:30
Show Gist options
  • Save munrocket/6ca807fd2b94d2429b59ed8fb7d50621 to your computer and use it in GitHub Desktop.
Save munrocket/6ca807fd2b94d2429b59ed8fb7d50621 to your computer and use it in GitHub Desktop.
Linux/Windows iOS testing

Console On Screen Universal Solution

const scrConsole = document.createElement('div');
scrConsole.id = 'screenConsole';
scrConsole.style.position = 'absolute';
scrConsole.style.zIndex = 9e9;
scrConsole.style.bottom = '5px';
scrConsole.style.left = '5px';
scrConsole.style.color = 'white'; 
scrConsole.style.fontSize = '.8em'; 
scrConsole.style.userSelect = 'none';
scrConsole.style.webkitUserSelect = 'none';
document.body.appendChild(scrConsole);
const addSniffer = (spyTarget) => function() {
  spyTarget.apply(window.console, arguments);
  sniffer([...arguments]);
}
window.console.log = addSniffer(window.console.log);
window.console.error = addSniffer(window.console.error);
function sniffer(string) {
  string.forEach(line => {
    let div = document.createElement("div");
    let text = document.createTextNode(line);
    div.appendChild(text)
    scrConsole.appendChild(div);
  });
}

Add this script on a page and run web server in same Wi-Fi network npx servez.

Old Manual How To Run Web Inspector

remotedebug-ios-webkit-adapter on Linux/Windows with iOS 12.2+

* Follow Step 1 from the readme
* Instead of following Step 2 from the readme, download the code from [here](https://github.com/arseneyr/remotedebug-ios-webkit-adapter/tree/ios12.2) as described in this [issue](https://github.com/RemoteDebug/remotedebug-ios-webkit-adapter/issues/138#issuecomment-493324681)
* Make sure you are using node 11 instead of 12 or the next step will fail. (`nvm install 11 && node -v`)
* In downloaded remotedebug-ios-webkit-adapter directory update typescript and typemoq (`npm i [email protected] && npm i [email protected]`, )
* Run `npm install`, `npm build` and `npm start` with conected iPhone/iPad
* Continue onto Step 3 from the readme

Also worth noting that chrome://inspect doesn't scan port 9000 by-default so you need to add localhost:9000 using the Configure button.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment