ember-bootstrap/ember-bootstrap-constraint-validations

Integrate native HTML5 validation into custom styled ember-bootstrap forms.

ember-bootstrap

An ember-cli addon for using Bootstrap 4 und 5 in Ember applications.

The addon includes the Bootstrap CSS (or Sass, Less) in your project (can be disabled). On top of that, it provides a set of native Ember components (no use of Bootstrap JavaScript!).

See www.ember-bootstrap.com for full documentation.

Installation

In your application's directory:

ember install ember-bootstrap

This will install Bootstrap 4 and will use the currently installed preprocessor or none if one is not installed. To switch Bootstrap version or preprocessor, see the setup documentation.

Compatibility

Ember Bootstrap works and is fully tested with

• Ember.js 4.8 or above
• Ember CLI 4.8 or above
• Bootstrap 4 and 5
• all modern evergreen browsers (Chrome, Firefox, Safari, Edge)
• node.js 18+
• FastBoot 1.0+
• Embroider: we strive (and test) for maximum compatibility with Embroider, including the most aggressive setting (staticComponents) for tree shaking and code splitting. However as Embroider itself is still considered beta software, we won't be able to guarantee that for the time being.

This project follows Semantic Versioning.

Updates

See CHANGELOG for the list of all changes.

If you want to keep up to date with ember-bootstrap, you may want to follow me on Twitter.

Author and collaborators

• Simon Ihmig
• Stephen Vance
• Jeldrik Hanschke
• Sander Knauff
• and many more contributors

Contributing

See the Contributing guide for details.

Copyright and license

Code and documentation copyright 2020 kaliber5 and contributors. Code released under the MIT license.

ember-bootstrap-constraint-validations's Issues

validationMessages are not reflected in some cases

For integrating Element.validationMessage with Ember's autotracking system, the addon builds on the assumption that whenever validationMessage of an element changes, also the value property of FormElement changes:

ember-bootstrap-constraint-validations/addon/components/bs-form/element.js

Lines 22 to 23 in 87068d2

	// native validation state doesn't integrate with Ember's autotracking, so we need to invalidate our `errors` getter explicitly when
	// `this.value` changes by consuming it here.

This assumption is not correct in some cases:

• <input type="time"> might be partially filled. Browser set InputElement.validity.badInput to true and populate InputElement.validationMessage with an error message in that case. But they do not update the value of the InputElement as it must not be a bad input.
• Consumers may set a custom validation message, which depends on the current locale. The current locale may change and therefore the validation message without the value being changed.

For the second case a consumer may fork this repository and consume current locale in addition to the value in errors getter. But I don't see a solution for the first case. As far as I know there isn't any event fired from the browser when an user partially fills the text input.

I run into this limitation when doing a PoC on migrating an use case from ember-cp-validations to native validations of the platform using this addon. My use case required both: showing validation errors when input is partially filled and updating validation errors when the locale changes. The PoC showing the two problems could be found here: https://github.com/jelhan/ember-bootstrap-constraint-validations-intl-support-poc

I also asked at StackOverflow about this limitation of constraint validation API and if there is a way around it.

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Warning

These dependencies are deprecated:

Datasource	Name	Replacement PR?
npm	babel-eslint
npm	eslint-plugin-node
npm	npm-run-all
npm	release-it-lerna-changelog

Rate-Limited

These updates are currently rate-limited. Click on a checkbox below to force their creation now.

• Update dependency prettier to v2.8.8
• Update dependency qunit to v2.19.4
• Update dependency @ember/optional-features to v2.1.0
• Update dependency @ember/test-helpers to v2.9.4
• Update dependency bootstrap to v5.3.3
• Update dependency ember-auto-import to v2.7.4
• Update dependency ember-focus-trap to v1.1.0
• Update dependency ember-resolver to v8.1.0
• Update dependency ember-source to v4.12.4
• Update dependency eslint-config-prettier to v8.10.0
• Update dependency qunit to v2.22.0
• Update dependency webpack to v5.94.0
• Update actions/checkout action to v4
• Update actions/setup-node action to v4
• Update dependency @ember/test-helpers to v4
• Update dependency ember-bootstrap to v6
• Update dependency ember-cli to v5
• Update dependency ember-cli-babel to v8
• Update dependency ember-page-title to v8
• Update dependency ember-qunit to v8
• Update dependency ember-resolver to v13
• Update dependency ember-source to v5
• Update dependency ember-template-lint to v6
• Update dependency ember-try to v3
• Update dependency eslint to v9
• Update dependency eslint-config-prettier to v9
• Update dependency eslint-plugin-ember to v12
• Update dependency eslint-plugin-prettier to v5
• Update dependency eslint-plugin-qunit to v8
• Update dependency prettier to v3
• Update dependency qunit-dom to v3
• Update dependency release-it to v17
• Lock file maintenance
• 🔐 Create all rate-limited PRs at once 🔐

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• Replace dependency babel-eslint with @babel/eslint-parser 7.11.0
• Replace dependency eslint-plugin-node with eslint-plugin-n 14.0.0
• Replace dependency npm-run-all with npm-run-all2 5.0.0
• Update dependency ember-cli-dependency-checker to v3.3.2
• Update dependency ember-focus-trap to v1.0.2
• Update dependency ember-source to v4.8.6
• Update dependency eslint-plugin-qunit to v7.3.4
• Update dependency ember-cli to v4.12.3
• Update dependency @embroider/test-setup to v4
• Update dependency release-it-lerna-changelog to v5
• Click on this checkbox to rebase all open PRs at once

Detected dependencies

github-actions

.github/workflows/ci.yml

• actions/checkout v2
• actions/setup-node v2
• actions/checkout v2
• actions/setup-node v2
• actions/checkout v2
• actions/setup-node v2

npm

package.json

• ember-cli-babel ^7.26.11
• ember-cli-htmlbars ^6.0.1
• @ember/optional-features 2.0.0
• @ember/test-helpers 2.8.1
• @embroider/test-setup 1.8.3
• @glimmer/component 1.1.2
• @glimmer/tracking 1.1.2
• babel-eslint 10.1.0
• bootstrap 5.2.3
• broccoli-asset-rev 3.0.0
• ember-auto-import 2.4.3
• ember-bootstrap 5.1.1
• ember-cli 4.5.0
• ember-cli-dependency-checker 3.3.1
• ember-cli-inject-live-reload 2.1.0
• ember-cli-sri 2.1.1
• ember-cli-terser 4.0.2
• ember-disable-prototype-extensions 1.1.3
• ember-export-application-global 2.0.1
• ember-focus-trap 1.0.1
• ember-load-initializers 2.1.2
• ember-page-title 7.0.0
• ember-qunit 5.1.5
• ember-resolver 8.0.3
• ember-source 4.8.2
• ember-source-channel-url 3.0.0
• ember-template-lint 4.18.2
• ember-try 2.0.0
• eslint 7.32.0
• eslint-config-prettier 8.5.0
• eslint-plugin-ember 10.6.1
• eslint-plugin-node 11.1.0
• eslint-plugin-prettier 4.2.1
• eslint-plugin-qunit 7.3.3
• loader.js 4.7.0
• npm-run-all 4.1.5
• prettier 2.8.0
• qunit 2.19.3
• qunit-dom 2.0.0
• release-it 14.14.3
• release-it-lerna-changelog 3.1.0
• webpack 5.75.0
• node 12.* || 14.* || >= 16

---

• Check this box to trigger a request for Renovate to run again on this repository