Facebook Pixel

Password Strength

React.js
easy

Description

Build a password strength checker in React that evaluates and displays the strength level of a user's password. The goal of this problem is to create a password strength checker that evaluates the strength of a given password based on specific criteria. The password is considered strong if it meets all or 4 of the following rules:

  1. Length: At least 8 characters.
  2. Uppercase Letters: At least one uppercase letter (A-Z).
  3. Lowercase Letters: At least one lowercase letter (a-z).
  4. Numbers: At least one digit (0-9).
  5. Special Characters: At least one special character (e.g., @, #, $, %, etc.).

Strength Levels:

  • Level 1: Password meets only 1 of the 5 criteria
  • Level 2: Password meets 2 or 3 of the 5 criteria
  • Level 3: Password meets 4 or 5 of the 5 criteria
  • If the password does not meet any criteria, it's considered a weak password and the function returns " Weak Password ".

Important Instructions

  • Define a helper function called checkPasswordStrength inside the same file.
  • Export that helper function so it can be tested separately
  • The UI should have:
    • An input field for password
    • A button to check strength
    • A strength result displayed after clicking

Example Inputs & Outputs

Example 1:

  • Input: ""
  • Output: "Weak Password"
  • Explanation: The password is empty, so it doesn't meet any criteria.

Example 1:

  • Input: "abc123"
  • Output: "Level 1"
  • Explanation: The password contains lowercase letters and numbers but doesn't meet the other criteria (uppercase, special character).

Example 2:

  • Input: "abc123ABC"
  • Output: "Level 2"
  • Explanation: The password meets 3 criteria: length (>=8), lowercase, and numbers, but lacks a special character.

Example 3:

  • Input: "Abc12345"
  • Output: "Level 2"
  • Explanation: The password meets 4 criteria: length, uppercase, lowercase, and numbers, but lacks a special character.

Example 4:

  • Input: "Abc@1234"
  • Output: "Level 3"
  • Explanation: The password meets all 5 criteria: length (>=8), uppercase, lowercase, numbers, and special character.

Reference UI

passwordStrength

Preview what you need to build

Solve Similar questions 🔥