Yes you read right, we definately need a good mobile web browser for developers because there isn't any. You might say that there is a good mobile browser, Google Chrome.
Google Chrome does give us access to new css and js asap but I want different things and Chrome does not provide those features.
What features do I want ?
The features I want are present in all browser but only for desktops not for mobiles.
Those are
- developer mode
- inspect element
- console
What feature does mobile browsers offer ?
None of the above
Some mobiles browser have few special features that could be helpfull for developers but they does not provide any of the above features.
What I am thinking to do
You might guessed it. I want to create a new open source browser for mobiles.
Which will at least provides 1 specific feature of inspecting elements (HTML & CSS).
After that adding console support and other features to it (if possible)
What's the problem
This project have few probloms. First of them is myself.
I don't know how can I make a web browser. My first thought was creating a website which will take input of url from the user then fetch it and set it to innerHTML of a div element.
something like this
<body>
<header>
<form>
<input type="text" placeholder="enter url" name="browserInputBar" /><input
type="submit"
value="search"
/>
</form>
</header>
<main><div id="display"></div></main>
<script type="module">
const form = document.querySelector("form");
async function fetchData(query) {
const res = await fetch("https://" + query);
const data = await res.body(); // I was checking this
/* I don't know what to use for HTML response .text, .json, .blob, .body or anything else*/
return data;
}
form.addEventListener("submit", (e) => {
e.preventDefault();
const query = form.browserInputBar.value;
const data = fetchData(query);
document.querySelector("#display").innerHTML = data;
});
</script>
</body>
But this is not working. I am getting CORS error.
I want your help to create the best browser for developers
Here is the link to GitHub repo developer-browser
My aim
My aim is to create the best mobile web browser for mobile devices
Top comments (16)
Remote debugging is actually a thing... it allows you to use your developer tools to inspect the site loaded on the mobile browser.
...and also a much better option than trying to use developer tools on a tiny screen with your fingers. This is almost certainly why they didn't build the devtool UIs for mobile in the first place - it doesn't make a great deal of sense.
I want this features for another reason. I do know about mobiles debugging. I sometimes use that.
I am into some web scraping lately. I need to check all of my targeted website whether they have the data I want easily accessible or not.
For example youtube's website does not use video element to display the video also few other video websites do use video element to display the video but they have CORS so no one can access their video direct through the video url.
I want this kind browser so that I can check their code while I am outside I don't have access to my pc.
So, you don't want a better mobile browser... you want a dodgy browser...
dodgy browser is this name of the browser
i actually wrote a blog post about this very recently!
dev.to/wraith/a-mobile-bugs-life-4g2d
I know about this but I will read you blog for more knowledge.
Use chrome://inspect and debug it from your desktop via a USB cable - MUCH more practical than a browser dev console on your tiny mobile screen would be ...
Heck, I'm even using chrome://inspect often not just to debug but also to simply interact when testing sites and apps on my phone - it's so much easier from a desktop machine.
Hey! Good take. I’d try making it an extension for Chrome and finding a way to use it in mobile. It appears that Chromium-based browser, like Kiwi Browser or Yandex, allow such extensions. Or making your own chromium based browser.
iOS 17 is out and I have yet to hear that non-WebKit browsers are a thing yet as was predicted earlier this year.
thank you
Hey Dipankar, that sounds like a cool project! In case you're interested, applications are still open for the Codacy Pioneers, where we're looking for the most innovative OSS developers to support through sponsorship, mentorship, free tools and free publicity. We want to give back to the community and excited to share these developer stories with the world.
Apply until September 29th ;)
i use kiwi browser on android, it has devtools that google chrome have on desktop version
thank you
now no need to make a new browser
There are 2 features that I'd like in a new (or not) browser.
Something that miss a lot on mobile is the ability to customize web experience with extensions and plugins.