Give up on making constraintText selector "backwards-compatible".

Author: avinashbot

src/file-upload/internal.tsx

@@ -13,7 +13,7 @@ import InternalFileDropzone from '../file-dropzone/internal';
 import { useFilesDragging } from '../file-dropzone/use-files-dragging';
 import InternalFileInput from '../file-input/internal';
 import InternalFileTokenGroup from '../file-token-group/internal';
-import { ConstraintText, FormFieldError, FormFieldWarning } from '../form-field/internal';
+import { ConstraintTextArea, FormFieldError, FormFieldWarning } from '../form-field/internal';
 import { useInternalI18n } from '../i18n/context';
 import { getBaseProps } from '../internal/base-component';
 import { fireNonCancelableEvent } from '../internal/events';
@@ -167,9 +167,9 @@ function InternalFileUpload(
               </FormFieldWarning>
             )}
             {constraintText && (
-              <ConstraintText id={constraintTextId} hasValidationText={!!errorText || !!warningText}>
+              <ConstraintTextArea id={constraintTextId} hasValidationText={!!errorText || !!warningText}>
                 {constraintText}
-              </ConstraintText>
+              </ConstraintTextArea>
             )}
           </div>
         )}

src/form-field/internal.tsx

@@ -92,7 +92,7 @@ export function FormFieldWarning({ id, children, warningIconAriaLabel }: FormFie
   );
 }
 
-export function ConstraintText({
+export function ConstraintTextArea({
   id,
   hasValidationText,
   children,
@@ -291,7 +291,7 @@ export default function InternalFormField({
             </FormFieldWarning>
           )}
           {(constraintText || characterCountText) && (
-            <ConstraintText hasValidationText={!!errorText || !!warningText}>
+            <ConstraintTextArea hasValidationText={!!errorText || !!warningText}>
               {constraintText && (
                 <span id={slotIds.constraint} className={testStyles.constraint}>
                   {constraintText}
@@ -306,7 +306,7 @@ export default function InternalFormField({
                   <ScreenreaderOnly id={slotIds.characterCount}>{debouncedCharacterCountText}</ScreenreaderOnly>
                 </>
               )}
-            </ConstraintText>
+            </ConstraintTextArea>
           )}
         </div>
       )}

src/test-utils/dom/form-field/index.ts

@@ -21,9 +21,7 @@ export default class FormFieldWrapper extends ComponentWrapper<HTMLElement> {
   }
 
   findConstraint(): ElementWrapper | null {
-    return this.find(
-      `:scope > .${styles.hints} .${styles.constraint}, :scope > .${styles.hints} .${testStyles.constraint}`
-    );
+    return this.find(`:scope > .${styles.hints} .${testStyles.constraint}`);
   }
 
   findCharacterCount(): ElementWrapper | null {