hyphens:auto test

[paulirish]

i dont think this is high priority.. just wanted to write this down..

http://people.mozilla.org/~jkew/hyph.html (just has the moz prefixed version)

http://www.w3.org/TR/2011/WD-css3-text-20110412/#hyphens

it's available in safari nightly and in 5.1 (along with text-emphasis). but not any version of chrome.

it landed 12mo ago http://trac.webkit.org/changeset/61548

anyway a basic feature test will false positive in chrome, so it'll have to be a functional feature test... somehow... i have no idea.

maybe fixed width font and with hyphens text should only wrap to two lines but without hyphens it gets forced to three.. test the height of the box? fun!

[paulirish]

demo thing from divya http://jsfiddle.net/nimbu/Rv6vV/

[NoNoNo]

I would like to see a Modernizr test that works with hyphenator as a yepnope fallback.

Some links:

• How hyphenator 4.0.0 tests at runtime for nativ CSS3 support
• hyphenator 4.0.0 automated test
• FF6’s native CSS3 support

Some caveats:

• Chrome actually knows -webkit-hyphens but does no hyphenation
• Some browsers only hyphenate text in the system language

[nwtn]

I just posted at http://davidnewton.ca/the-current-state-of-hyphenation-on-the-web about this, with some proof-of-concept tests for Modernizr. Kinda hacky/needs some work, but it seems to be functioning at least.

https://github.com/nwtn/Modernizr/blob/master/feature-detects/hyphens.js

demo page: http://dev.davidnewton.ca/demos/hyphenation/test.html

[paulirish]

thx nwtn! i pulled your code in. :)

probably could clean this up some but this is good for now. nice research!

[nwtn]

sweet. could definitely use some cleanup, i agree. :)

[paulirish]

I filed crbug.com/107111 for chrome to stop exposing Hyphenation so we dont need this workaround.

[paulirish]

I cleaned up @nwtn's hyphen tests a little in f56ddf7 and made the base hyphens:auto work like our other false-positiving tests do.

and more docs in 3f10031 (plus a code shift)

thx for those links before @NoNoNo .. super useful.

current result is here: https://github.com/Modernizr/Modernizr/blob/master/feature-detects/hyphens.js

We can close this ticket now.. I'm going to watch crbug.com/107111 and when that fix ships to stable Chrome me or @nwtn can remove the functional test .

[paulirish]

caniuse has a nice wrap-test that could use ElementFromPoint to detect: http://tests.caniuse.com/ thx @Fyrd

[alexlande]

I wanted to give this a try and generated a custom build with the hyphen test. I'm getting no-workingcsshyphens in every browser, including Firefox and Safari.

The original demo by @nwtn applies workingcsshyphens in those browsers.

[paulirish]

@lawnday, this isnt available in the custom builder just yet. You can try out the latest on the test suite: http://modernizr.github.com/Modernizr/test/index.html

[alexlande]

Ah, my mistake, thanks.

[ShaggyDude]

This is prob. not the place to ask but what is the status on chrome implementing hyphens?

[paulirish]

what is the status on chrome implementing hyphens?

read and star this badboy: http://code.google.com/p/chromium/issues/detail?id=47083