Client side form validation doesn't show errors

In my user registration form i have this

<?php $form = ActiveForm::begin(
                                [
                                    'id' => $model->formName(),
                                    'enableAjaxValidation' => false, 
                                    'enableClientValidation' => true,
                                    'options' => ['autocomplete' => 'off'],
                                    'action'  => Url::to(['/user/register'], 'https')
                                ]
                            ); ?>

<?= $form->field($model, 'password', ['inputOptions' => ['autocomplete' => 'off', 'class' => 'form-control form-control-lg']])->passwordInput(['placeholder' => ""]) ?>

<?= $form->field($model, 'password_repeat', ['inputOptions' => ['autocomplete' => 'off', 'class' => 'form-control form-control-lg']])->passwordInput(['placeholder' => ""]) ?>

and in my user model rules() i have this to validate passwords

 // password rules
            ['password', 'trim'],
            ['password', 'required', 'on' => ['register']],
            ['password', 'string', 'min' => 8, 'max' => 72, 'on' => ['register', 'create']],
            [
                'password', 
                'match', 
                'pattern' => '/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/', 
                'message' => 'Minimum eight characters, at least one uppercase letter, one lowercase letter, one number and one special character.',
                'on' => ['register', 'create']
            ], 

when i submit the form i get the error message

Minimum eight characters, at least one uppercase letter, one lowercase letter, one number and one special character.

when a short password is entered the user get an error

Password should contain at least 8 characters.

but when someone types in an invalid password in the form (Minimum eight characters, at least one uppercase letter, one lowercase letter, one number and one special character.), the input is still highlighted in green and not red. Form is able to submit too.

Any idea what I’m doing wrong here? Thank you.

The documentation states the password validator is only supported server side.
https://www.yiiframework.com/doc/guide/2.0/en/input-validation#using-client-side-validation
Perhaps create your own validator
(scroll down for example )

You also have to make sure you registered scenario properly. i mean ‘on’ in your validation rule.