Material-ui: onloadwff.js:71アサーションに失敗しました:入力引数がHTMLInputElementではありません

作成日 2019年03月12日  ·  12コメント  ·  ソース: mui-org/material-ui

  • [x]これはv0.xの問題ではありません。
  • [x]このリポジトリの問題を検索し

期待される動作🤔

multiline={true} TextFieldを使用する場合、コンソールエラーは発生しないはずです。

現在の動作😯

multiline TextFieldform )をレンダリングしてenterキーを押すと、以下がコンソールに記録されます(キーが押されるたびに) )::

onloadwff.js:71 Assertion failed: Input argument is not an HTMLInputElement
  getFormProfile @ onloadwff.js:71
  setFieldValue @ onloadwff.js:71
  formKeydownListener @ onloadwff.js:71

onloadwff.js:71 Uncaught TypeError: Cannot read property 'type' of undefined
    at e.setFieldValue (onloadwff.js:71)
    at HTMLFormElement.formKeydownListener (onloadwff.js:71)

再現する手順🕹

  1. https://material-ui.com/demos/text-fields/にアクセスし、Chromeの開発コンソールを開き
  2. [TextField]セクションで、複数行のコントロールをクリックし、Enterキーを数回押します
  3. コンソールに記録された例外に注意してください

このバグはChrome(Ubuntu18とWindows10の両方)で再現できました。
Firefox(UbuntuおよびWindows)では再現できませんでした。

私のプロジェクトでも同じ問題があり、Material-UのWebページにも問題があることがわかりました。

複数行のテキストフィールドがフォームタグでラップされていない場合、バグは表示されないことに注意してください

コンテキスト🔦

ここではあまりコンテキストがありません。複数行のテキストフィールドをレンダリングし、これらの例外がコンソールに記録されていることを確認しました。

あなたの環境🌎

| 技術| バージョン|
| -------------- | --------- |
| マテリアル-UI | v3.0.1およびv.3.9.2 |
| React | 16.6.3 |
| ブラウザ| Chrome、Firefox(両方とも最新)|
| TypeScript | いいえ|
| など| -|

TextField external dependency

最も参考になるコメント

LastPassを使用しているのは誰ですか? 手を挙げて! ( onloadwff.js

全てのコメント12件

LastPassを使用しているのは誰ですか? 手を挙げて! ( onloadwff.js

@npapagnaこれは最近のLastPassリグレッションです。 長い間対処されていなかったために、この種の問題が発生した可能性は非常に疑わしいです。 ネイティブの<textarea /> 、同じ複製で試すことができます。

Capture d’écran 2019-03-12 à 23 52 33

@oliviertassinariはそれを手に入れました!

これを見てくれてありがとう! 👏

いいね! しかし、拡張機能を同時に維持しながら、それを取り除く方法はありますか?

いいね! しかし、拡張機能を同時に維持しながら、それを取り除く方法はありますか?

これに対する公式の修正はありませんが、とにかく可能な回避策は次のとおりです。

  1. LastPass拡張機能を右クリック
  2. 「これによりサイトデータを読み取って変更できる」を選択します。
  3. 次に、「拡張機能をクリックしたとき」を選択します。

ページをリロードすると、エラーが消えます。

敬具。

@sfanculatodinotteありがとう!

いいね! しかし、拡張機能を同時に維持しながら、それを取り除く方法はありますか?

こんにちは!

次のようにURLを除外することもできます。

  1. LastPassにアクセスして、アカウントに接続します
  2. Account parametersセクションに移動します
  3. [ URL Exclusions ]タブに移動します
  4. http://localhostなどのページの除外を追加します

お役に立てれば!

よろしく:リラックス:

LastPassを使用しているのは誰ですか? 手を挙げて! (_onloadwff.js_)

:D、私にとってのベストアンサー、どうもありがとうございました:)))

あなたがユーザーなら、lastpassを無効にするだけでいいのですが、私たち全員がここにいる開発者ですよね? では、LastPassを使用している(そしてこのgithubの問題を見つけることは決してない)ユーザーのためにフォームが壊れないようにするにはどうすればよいでしょうか?

明確にするために、このエラーはページ上の何も壊さない、それは開発者にとってノイズです。 それを修正したい場合は、LastPassサポートに連絡してください。リクエストが多いほど、優先される可能性が高くなります。

私の悪いことに、入力にバグを引き起こす別の奇妙なエラーがありました。このエラーは確かに単なるノイズです。

<textarea class="form-control" id="messageBody"
            onkeypress={supressEnterPropagation}
            name="body"
            rows="18"
          ></textarea>
const supressEnterPropagation = (event) {
    if (event.which === 13 || event.keyCode === 13 || event.key === "Enter")
        event.stopPropagation()
     }
}

あなたはその考えを思いついた。 そのsudoコード

このページは役に立ちましたか?
0 / 5 - 0 評価