Md-inputs not showing text typed into them

[jpike88]

This is a serious usability issue and requires top priority as there are plenty of use cases which would have a form start off the page.

This video shows the problem.

https://www.dropbox.com/s/428d9p0947kt46i/Untitled.mov?dl=0

[jpike88]

@ThomasBurleson You mentioned in another thread that changing the style to '-webkit-overflow-scrolling: auto' solves the issue, which it does at the expense of usability.

Is this a webkit bug or an md-input-container bug, and what is the next step, as that is just a workaround?

[topherfangio]

@jpike88 As far as I can tell, it is a Webkit bug as it can affect things other than the input container; that just happens to be one of the most noticeable.

I was looking into this a while ago, and if I recall correctly, I was able to fix the issue by adding that autoscroll CSS to a parent of the inputs, but a child of the content. So, something like this seemed to work:

<md-content>
    <div style="-webkit-overflow-scrolling: auto;">
        <md-input-container><input /></md-input-container>
        <md-input-container><input /></md-input-container>
        <md-input-container><input /></md-input-container>
    </div>
</md-content>

Can you give this a test and see if it works for you?

[jpike88]

Weird it works.

I think this needs to be hardcoded in ng-material, there's no way I would have found that workaround out on my own.

[topherfangio]

@jpike88 If we can find a simple/backwards-compatible way to include it, I totally agree that it should be added. Perhaps at the very least we may be able to add it to the input component itself since it seems to be the worst offender.