fix validation skipping#60
Conversation
✅ Deploy Preview for tiny-form-fields ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
|
|
||
| else | ||
| [ Attr.pattern ".*" ] | ||
| [ Attr.pattern ".+" ] |
There was a problem hiding this comment.
more accurate since we do want them to fill this in (it is a required field even without the pattern)
| div [ class "tff-error-text" ] [ text "Question titles must be unique in a form" ] | ||
|
|
||
| else if isEmptyLabel then | ||
| div [ class "tff-error-text" ] [ text "Question title cannot be empty" ] |
There was a problem hiding this comment.
since we show err message for duplicate, why not also empty
|
Discuss Note: in a conversation, the human speech bubbles would be more noteworthy than the agent's speech bubbles |
| , Cmd.none | ||
| ) | ||
| ( Just prevIndex, _ ) -> | ||
| if selectedFieldIsInvalid model then |
There was a problem hiding this comment.
i kept the if selectedFieldIsInvalid model then and added an animation if user tries to click away because i think its still a better ux than allowing them to close the tab and not understand why the form is invalid
the scattering of if statement is addressed in #60 (comment)
yellow.mov
| , value (Json.Encode.encode 0 (encodeFormFields model.formFields)) | ||
| ] | ||
| [] | ||
| :: viewEditorValidationGate model.formFields |
There was a problem hiding this comment.
validate form on model update instead of only scattering if selectedFieldIsInvalid
| app.ports.scrollIntoView.subscribe((id) => { | ||
| var el = document.getElementById(id); | ||
| if (el) el.scrollIntoView({ behavior: 'smooth', block: 'nearest' }); | ||
| }); |
There was a problem hiding this comment.
on top of animating an invalid field, it scrolls to it
if selectedFieldIsInvalid model then
( { model | viewMode = Editor { maybeAnimate = Just ( prevIndex, AnimateYellowFade ) } }
, Cmd.batch
[ Process.sleep animateFadeDuration
|> Task.perform (always (SetEditorAnimate Nothing))
, scrollIntoView ("tff-field-" ++ String.fromInt prevIndex)
]
)
2 participants
problem: users are able to bypass invalid states in the field settings by creating a new input with valid state
video shows
bug.mov
same thing for dup checks
emailbug.mov
after fix
actions will be disabled if field settings are invalid
for dup
fixdup.mov
for empty
afterfix.mov