I am automating https://www.zoho.com/login.html. This page has sign in section inside a frame. When i switch through different frames and search for my Email/Phone field (Sign In section), i can find it and then hence use the working block (below) but cannot use the similar code (also below) the only difference between two block is how i have identified my userNameInputBox element.

//This is working

       List<WebElement> iframeElements =   driver.findElements(By.tagName("iframe"));
                int nFrames = iframeElements.size();

        //Switching frame to go to login frame  
        for (int i=0; i<=nFrames ; i++) {
            System.out.println("nFrames: " +nFrames);
            driver.switchTo().frame(i);
            if (driver.findElement(By.name("lid")).isDisplayed()){


                driver.findElement(By.name("lid")).sendKeys("myuserName1");
}}

However if i use this (below code) it does not work and instead gives me NullPointerException in the line where i .click my userNameInput into username field.

///This is not working

//Elements

    @FindBy(name="lid")
    WebElement userNameInput;

//Switching frame to go to login frame  
        for (int i=0; i<=nFrames ; i++) {
            System.out.println("nFrames: " +nFrames);
            driver.switchTo().frame(i);
            if (driver.findElement(By.name("lid")).isDisplayed()){
                userNameInput.click(); //clicking the inputBox
                userNameInput.sendKeys("myuserName"); //Sendingkeys into
}}

Can somebody please explain what could be the reason of such anomaly? Or point out what have i missed? I want to use @FindBy for the WebElement.