All conversations in #compatchat at Aug. 15th, 2016

Mozilla Developer 👩🏾‍💻 @mozhacks

📣 Welcome to #CompatChat. We’re joined by @potch & @miketaylr to dig into progressive enhancement & cross-browser compatibility testing!

Mozilla Developer 👩🏾‍💻 @mozhacks

Join us for a live twitter #compatchat, to avoid unpleasant situations like... this, ugh-oh! pic.twitter.com/TaK2Ku4h3I

拡大

potch @potch

Hey all! Along with @miketaylr and others, I’m taking questions on @mozhacks about cross-browser testing. You can tag ?s with #compatchat

Mozilla Developer 👩🏾‍💻 @mozhacks

❓Today's first question coming up: What are some common mistakes that developers can avoid in their CSS/JS code #compatchat

Vlad Filippov @vladikoff

@mozhacks #compatchat what resources should devs use besides `caniuse dot com` to stay compatible with most browsers?

Mike Taylor @miketaylr

@mozhacks not using prefixless CSS with vendor prefixes. Or, putting prefixed CSS after unprefixed, e.g. gist.github.com/miketaylr/aa54… #compatchat

Mike Conley (@mconley@fosstodon.org) @mike_conley

#compatchat Should I be using flexbox yet?

Gonzalo Aguilar @gaguilardelgado

#compatchat The first one can be. How can I test my app for a wide range of devices and sizes? #Mono has one system to do that but we don't.

potch @potch

@vladikoff @mozhacks Many browsers now maintain “platform status” pages that include upcoming support in addition to current. #compatchat

Bruce Lawson @brucel

@miketaylr @mozhacks also, if using gradients as bg images, ensure you previously define a bg color that contrasts well with text (1 of 2)

Bruce Lawson @brucel

@miketaylr @mozhacks (2 of 2) b/c Opera Mini (>250m users) doesn't render the gradent & users hate white text on white background

Mike Taylor @miketaylr

@gaguilardelgado there’s a number of good services like browserstack, sauce labs, browserling, etc. that can be used #compatchat

potch @potch

@vladikoff Chrome: chromestatus.com Firefox: platform-status.mozilla.org IE/Edge: developer.microsoft.com/en-us/microsof… Safari: webkit.org/status/

Mike Taylor @miketaylr

@gaguilardelgado (some even have free options — for open source, or limited test windows). Emulators + VMs also a good option! #compatchat

Shwetank Dixit @shwetank

@vladikoff I would say MDN, chromestatus.com, developer.microsoft.com/en-us/microsof… #compatchat

Patrick Kettner @patrickkettner

@potch @vladikoff minor point of order - safari team has said multiple times that the webkit page does not reflect safari

Gonzalo Aguilar @gaguilardelgado

@miketaylr Hi, currently I'm using phantomjs for most testing with a custom platform. But building emulators + vm can be killing.

Daniel Fosco @dfosco

@miketaylr @mozhacks What's bad about the pattern on the gist?

potch @potch

@mike_conley Flexbox falls back well in browsers w/o support, & current support is rather good. Worth it depending on userbase! #compatchat

Dennis Schubert @denschub

@potch @mike_conley If you do use flexbox, be aware of github.com/philipwalton/f… #compatchat

Bruce Lawson @brucel

@mike_conley yes, imo. But use autoprefixer or similar to get all the prefixes you need & ensure degrades well in older browsers #compatchat

Mike Taylor @miketaylr

@dfosco @mozhacks unprefixed CSS should always come after prefixed, because the last value wins. #compatchat

Nils @nilsandrey

@potch @vladikoff Usefull samples from another perspective at kangax.github.io/compat-table/e… … and caniuse.com #compatchat

potch @potch

@patrickkettner @vladikoff Good point. It’s a pool from which future Safari's can pull. Safari Technology Preview is better signal.

Mike Taylor @miketaylr

@dfosco @mozhacks (and there might be different behaviors between unprefixed and prefixed) #compatchat