Adding character counter to Text input textfield/textarea component#1081
Adding character counter to Text input textfield/textarea component#1081shubham-adobeaem wants to merge 515 commits intoadobe:devfrom
Conversation
* test cases for custom submit action with redirect parameters * Update CustomAFSubmitService.java
…model, after validation rule deletion (adobe#859) * FORMS-9492: when validation expression is empty, remove the property from json model * FORMS-9492: test case added * FORMS-9492: incorporated review comments * FORMS-9492: update test-content.json
* [FORMS-10586] update html structure for RTL * add rtl in datepickerwidget * update class name * review points * update readme files * imple v2 wizard core component * update wizard test cases --------- Co-authored-by: Amit Kumar <amitkumar@adobe.com>
…g to styles (adobe#830) * Author UI dialog changes * persisting data into crx in the right format * Updating jcr property in runtime * Support via template policy * Servlet addons * Policy to dropdown within dialog code * Toggle additional properties - with bug of initial hide * storing custom properties in field's property in jcr * Fixed visibility toggle bug with jcr properties * Groupname storage in jcr and separate additional property field * Refactoring multifield hack * Conditonal rendering of advanced tab in dialogs based on presence of custom properties in template policy * Adding policy properties to headless json - WITH BUG: selecting multiple groups renders none * Addition of custom properties in form json, and refactoring * missed code rename from prev commit * Removing crx property for addon checkbox * Reverting removal of check in crx. Requirement exists in js * removed constant * code refactor * Fixing imports * Comment changes * Advanced tab related js * Implemented fix for edge case: Advanced tab will now be rendered on an additional constraint * Added Java ans JSdoc comments * comnvertToArray usecase replacement * Validations in Edit dialog and Template for keys and group names * Dialog warning on custom property delete on template policy * Typp fix * Support for panel and initial test cases * Cypress tests for custom properties * format changes * Fixed flaky test * Fix flaky test and cleanup of policy custom property * Fixed test failure * Test failure fixes * another test fix * fixing select blur test failure * Field descriptions * Custom properties support for Panel container via base ref * Minor fix * Container support * Incorporated review comments * Migration of logic to cq-guides * Clean up and bug fixes * Removed utiltiy functions * Refactoring and clean up * Space fix * Fixing constants * Support for accordion * wizard support * Support for both type of tabs and wizard * Moved snippet of additonal cp to cq guides and incorporated review comments * Fixing imports * Reverted old changes that are not necessary anymore * Incorporated review comments * removed stray xml property * change in internal function * Test case selector fixes * Supporting Omega tracking in design dialogs * Pom changes to incorporate local forms sdk api - needs to be changed when release happens * Updated aem-forms-sdk-api version * Changed aem-forms-sdk-api version post bugfix in cq-guides * Optional resolution of model package * NoClassDef class exception handling * Check in custom properties test to check for latest addon
…)"" This reverts commit 143ddb9.
Dev to master 1109
This reverts commit 3f1f981.
This reverts commit 8722c84.
* Releng moving to latest cloud ready quickstart * Fixing flaky test and adding logs * Fixing flaky test
Dev to master
Dev to master Sep 28
* Update af-core version * Fixed test cases
Dev to Master
* FORMS-12203: Added localization changes and test cases * FORMS-12203: Updated test case * FORMS-12203: Altered to contains instead of get * FORMS-12203: Resolved comments * FORMS-12203: Updated test cases * FORMS-12203: Updated delete button * FORMS-12203: Updated button * Retry wizard.locale.spec.js tests * FORMS-12203: Added theme request wait * Update wizard.locale.spec.js * Added latestaddon check * Delete ui.tests/test-module/package-lock.json * Update commands.js * Revert "Delete ui.tests/test-module/package-lock.json" This reverts commit fd97b53. * Reverted package-lock.json changes * FORMS-12203: Removed exception inline * FORMS-12203: Resolved comments * FORMS-12203: Update index.js * FORMS-12203: Removed package-lock.json change * Update index.js * Update error message in index.js * Update index.js * Update wizard.locale.spec.js * Removed an intercept * Updated regex patterns --------- Co-authored-by: Shivangi Mittal <shivangim@Shivangis-MacBook-Pro.local>
…be#1169) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) * Update space character for thousands separator in french lang * FORMS-13851 Support for language in date picker and number input @review @vdua DOD(Yes) --------- Co-authored-by: Varun Dua <vdua@adobe.com>
Devtomaster 18 apr
| @@ -0,0 +1,6 @@ | |||
| <template data-sly-template.characterCounter="${@ componentId, showCharCounter, maxLength, bemBlock}"> | |||
| <div data-sly-test="${showCharCounter}" class="${bemBlock}__charcounter" aria-label="Character Counter"> | |||
There was a problem hiding this comment.
Localize these like:
${'Character Counter' @ i18n, locale=request.locale}
There was a problem hiding this comment.
Similarly localize:
- Current Character Count
- Maximum Character Count
| // Check If Dialog Options Are Visible | ||
| cy.get("[name='./multiLine']") | ||
| .should("exist"); | ||
| cy.get("[name='./showCharCounter']") |
There was a problem hiding this comment.
Also add test if the input is updated, count is also updated.
| const updateCharacterCounter = () => { | ||
| const charCount = this.widget.value.length; | ||
| if (counterSpan) { | ||
| counterSpan.textContent = Granite.I18n.getMessage(charCount); |
There was a problem hiding this comment.
for localizing the number at runtime, you can't use Granite.I18n. You will need to do what is done at https://github.com/adobe/aem-core-forms-components/blob/dev/ui.af.apps/src/main/content/jcr_root/apps/core/fd/components/form/datepicker/v1/datepicker/clientlibs/site/js/datepickerwidget.js#L1013
| const charCount = this.widget.value.length; | ||
| if (counterSpan) { | ||
| counterSpan.textContent = Granite.I18n.getMessage(charCount); | ||
| } |
There was a problem hiding this comment.
Also do the same for max character count, as authour can write a rule to modify that and then the modified value should show up and also will need to be localized.
sakshi-arora1
left a comment
There was a problem hiding this comment.
Need to take care of localization, tests and a few other minor things.
# Conflicts: # bundles/af-core/src/main/java/com/adobe/cq/forms/core/components/internal/models/v1/form/TextInputImpl.java
This reverts commit 089ec60.
Description
Adds a character counter in textfield component.

Related Issue
Motivation and Context
How Has This Been Tested?
Screenshots (if appropriate):
Types of changes
Checklist: