Browser debugging tricks
A list of clever debugging tricks. TOC:
- Advanced Conditional Breakpoints
- monitor() class Calls
- Call and Debug a Function
- Pause Execution on URL Change
- Debugging Property Reads
- Use copy()
- Debugging HTML/CSS
Related cards:
Useful tricks for logging debugging information to the browser console
During debugging you might pepper your code with lines like these:
console.log('foo = ' + foo + ', bar = ' + bar)
I recommend to use [variable interpolation](https://makandracards.com/makandra/30113-the-developer-console-can-do-more-than...
Browsera - Automated Cross Browser Web Application Testing Service
Browsera automatically detects cross-browser layout problems and scripting errors on your website.
Browser Hacks: CSS Rules to Target Specific Browsers And Versions
The linked site lists a wealth of CSS hacks that let you apply styles to just that one browser. You should be using this mostly for fixing browser issues and not give up on creating solid styles.
BrowserStack has browser plugins for local testing
Local testing allows you to test your private and internal servers using the BrowserStack cloud, which has support for firewalls, proxies and Active Directory.
Change the color of a <hr> in all browsers
The following Sass will do it:
hr
color: #ddd
background-color: #ddd
border: none
height: 1px
Improving browser rendering performance
As the web is being used for more and more tasks, expectations rise. Not only should web pages offer rich interaction, they must be responsive in both size and interaction.
This imposes a paradoxon that needs to be solved by building performing a...
The Current State of Telephone Links | CSS-Tricks
The linked article shows what current browsers do when you click a link like this:
<a href="tel:1-562-867-5309">1-562-867-5309</a>
Spoiler: The current state is sad
It's...
Webpacker: Configuring browser compatibility
Webpacker uses Babel and Webpack to transpile modern JavaScript down to EcmaScript 5. Depending on what browser a project needs to support, the final Webpack output needs to be different. E.g. when we need to ...
Playing audio in a browser
If you want to play music or sounds from a browser, your choice is to use either Flash or the new <audio> tag in HTML5. Each method has issues, but depending on your requirements you might not care about all of them.
Flash
- Works in all ...