DEV Community ๐Ÿ‘ฉโ€๐Ÿ’ป๐Ÿ‘จโ€๐Ÿ’ป

Cover image for How To Access Dev Tool On Mobile Browsers

How To Access Dev Tool On Mobile Browsers

Recently, I was working on a side project with some friends. Unfortunately my PC had been damaged during the covid-19 pandemic and I couldn't get to fix it because of the lock-down, so I had to resort to coding on my mobile phone ๐Ÿคฆ๐Ÿพโ€โ™‚๏ธ.

Somehow, my code works perfectly offline, but for some reasons, it did not go well online ๐Ÿค’
And of course I'll be needing dev tool to access the console and check for errors.

Some minutes of googling later, I discovered it's very much possible to access the dev tool on mobile browsers with Eruda ๐ŸŽ‰

Below is how you can do open the dev tool on chrome mobile browser

Step 0

Bookmark your current page by clicking the star โญ symbol from the chrome menu.

After doing this, you should see a toast message Bookmarked with an edit button:

IMG_20200424_180749_459.jpg

Click the edit option and change the bookmark details to the following:

Name:

Mobile Dev Tool

URL (copy and paste code below):

javascript:(function () {var script=document.createElement('script');script.src="//cdn.jsdelivr.net/npm/eruda";document.body.appendChild(script); script.onload = function () { eruda.init() } })();

Step 1

  • Visit the web page you want to inspect
  • Enter the keyword Mobile Dev Tool into the search bar(you should see the page we bookmarked before with the url starting with javascript:...) click on the URL

Dev Tool On Android - Eruda

  • Wait for 3 Seconds for the Eruda icon to appear like below

DevTool on Android - Eruda

  • Click on the icon to open your dev tool

Dev Tool On Android - Eruda

  • Enjoy! ๐ŸŽ‰

Here's what you can do with the Eruda dev tool

  • View javascript console
  • Inspect element
  • Track Ajax requests
  • View website source files
  • Change CSS directly from web page
  • And other awesome features

Conclusion

Eruda is an open sourced javascript package publicly hosted on github here and contributions are welcomed.
If you'd found this article useful, c'mon show some love and share with your friends ๐Ÿค—

Finally, I share and retweet tech stuffs on Twitter too follow me @asaolu_elijah

Thanks for reading โค๏ธ

Top comments (13)

Collapse
mihaelagiurescu profile image
mihaela-giurescu

This is so cool, Asaolu! Thanks for making this extremely cool tool. I'm really new to everything code and programming so hopefully this question might help other beginners like me and not be very trivial, but is there a way to edit the source code (not the element alone, which I noticed it is possible) of the inspected pages and then also save the html locally?

Collapse
upieez profile image
Samuel Huang

You need to share how you did all your coding on the phone! I think that's the bigger achievement here ๐Ÿ˜‚

Collapse
asaoluelijah profile image
Asaolu Elijah ๐Ÿง™โ€โ™‚๏ธ Author

Lol ๐Ÿ˜… I'll probably write an article about that too ๐Ÿคน

Collapse
smithteev profile image
smithteev

Hello Guys! I am smithteev, I live in Uk Iโ€™m 42 Years old, am so happy I got my blank ATM card from Calvin Grayson. My blank ATM card can withdraw ยฃ5,500 daily. I got it from Him last week and now I have withdrawn about ยฃ350,000 for free. The blank ATM withdraws money from any ATM machines and there is no name on it because it is blank just your PIN Only. It is not traceable and now I have money for business, shopping and enough money for me and my family to live on. I am really glad and happy i met Calvin Grayson because I met Five persons before him and they could not help me. But am happy now Calvin Grayson sent the card through UPS and I got it in two days. Get yours from him right now, he is giving it out for affordable fee to help the poor. it helps a lot and no one ever gets caught or traced. Iโ€™m happy and grateful to Calvin Grayson because he changed my story all of a sudden. The card works in all countries that is the good new if you are interested in getting yours : email: officialblankatmservice@gmail.com or officialblankatmservice@yahoo.com

Collapse
davidhu04680571 profile image
david hume

Good day everyone , I have received a blank ATM card from Mr. Bednorz and with this card I am able to make daily withdrawals and also buy goods. Everyday I am entitled to $1500 spending from this card and it is valid for 3 months. Also Mr Georg wa.link/6yq696 remains your best bet when it comes to recovering your accounts.
If you want this type of ATM card kindly contact:
Text & Call or Whatsapp: +1(262)355-8285
Email: georgbednorzhackers @ gmail . com
Contact them for various types of hacking on:
-Blank atm cards hack
-Recover bitcoin wallets
-Recover stolen or lost bitcoin
-Recover any blocked or hacked social media; Facebook, Instagram, Snapchat, TikTok, Gmail, Yahoo mail and websites
-Upgrade your university score and grades without the knowledge of your school
-Western union transfer hack
-MoneyGram transfer hack
-Bank transfer hack
-PayPal transfer hack
-Cash app transfer hack
-Hack and get username and password of any social media including Facebook password, twitter, Instagram, yahoo mail, Gmail, Hotmail etc.
-Hack and retrieve Apple phone passwords and iPad.
-Bank transfer to any account of your choice in any country
-Upgrade your university scores and grades without the knowledge of the school
-Code generation to hack and shop online with any credit cards without alert from the owner.
-Hack into any server database and clear criminal records.
-Hack bank atm cards, pin and account details.
-Trace and locate anybody in the world
-Monitor all phones and email addresses.
-All paperwork including Driver's Licenses, International Passports, Birth Certificate, Passport Cards, Doctors Notes, Vehicles Registration, Insurance, Utility Bill, Flight Itinerary, Business Identity Cards, Boarding Pass, Employment Authorization, All Miscellaneous Document, Temporary Licenses, All Countries Residency, Forces.

Collapse
poopbutt83 profile image
Alicia Beckham

Does this still work?

Collapse
asaoluelijah profile image
Asaolu Elijah ๐Ÿง™โ€โ™‚๏ธ Author

Yes, Alicia

Collapse
aralroca profile image
Aral Roca

This is very useful ๐Ÿ˜„๐Ÿ‘

Collapse
aajunior88 profile image
Ayuba Abdullahi Jr

Super Useful

Collapse
r3tter profile image
Yaroslav

Thanks ๐Ÿ˜Š

Collapse
creatrixpe profile image
Away with Words (CreatrixPE)

The logo used to appear, but I can't get it to appear anymore. I used the bookmark, and I also made sure that chrome didn't omit the "JavaScript" part, to no avail. Why is it no longer working?

Collapse
hasan18850676 profile image
Hasan

This method does not work in Chrome Android browser for blockchain web wallet .... can anyone help in blockchain vol web version how to display console settings ?? !!

Collapse
asifsimform profile image
Asif Vora

Awesome โค๏ธ

๐ŸŒš Life is too short to browse without dark mode