UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:63.0) Gecko/20100101 Firefox/63.0

Example URL:
https://jfkthame.github.io/test/auto-vs-manual-hyphens.html

Steps to reproduce the problem:
1. Load testcase https://jfkthame.github.io/test/auto-vs-manual-hyphens.html

What is the expected behavior?
The two columns of examples should appear the same, or at least have very similar rendering. (It's possible the hyphenation positions found by hyphens:auto may not exactly match the manually-inserted soft hyphens in the manual column, but the overall effect should be similar.)

What went wrong?
In the right-hand column, with explicit soft hyphens, text wraps as expected as the width is reduced.

But in the left-hand column, using hyphens:auto, wrapping fails. It seems that Chrome gives up on automatic hyphenation as soon as one of the hyphenated fragments would completely fill (not even exceed!) the available width.

The CSS Text spec[1] says:

> When wrapping is enabled (see white-space), the UA must
> minimize the amount of content overflowing a line by
> wrapping the line at a soft wrap opportunity, if one exists.

Here, Chrome is failing to use auto-hyphenation wrap opportunities to minimize the amount of overflow in the narrow paragraphs, although we can see that additional hyphenation opportunities did exist.

[1] https://drafts.csswg.org/css-text/#line-breaking

Does it occur on multiple sites: Yes

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 67.0.3396.99 (Official Build) (64-bit)  Channel: stable
OS Version: OS X 10.13
Flash Version: Shockwave Flash 30.0 r0

Testcase works as expected in Firefox. Also works in MS Edge, though with slightly different automatic hyphenations.