Webform: Cannot read property 'set_value' of undefined

I am following this tutorial:
https://frappe.io/docs/user/en/guides/portal-development/web-forms

I want to set a field value when the Web Form loads. Source code below:

frappe.web_form.after_load = () => {
    var roll_number = window.location.hash.replace("#","");
    if(roll_number == ""){
	window.location.replace("/admissionstart#No roll number given");
    }
    frappe.call({
		            method: "frappe.client.get_list",
		            args:{
		               doctype: "Secondary School Result",
		    	       filters:[
				 	["roll_number", "=", roll_number]
				],
			       fields: ["roll_number", "mean", "student_names","school","year"]
                            },
		            callback: function(r) {
				if(r.message != ""){
					console.log(frappe.web_form)
					frappe.web_form.set_value("first_name", r.message[0].student_names)
   				}
                                else{
                               		 window.location.replace("/admissionstart#Roll number not found");
                                }
			    }
     })
}

I am getting below error as if frappe.web_form variable is not defined.

The API in the link above says
frappe.web_form.set_value([fieldname], [value])

Uncaught TypeError: Cannot read property 'set_value' of undefined
        at WebForm.set_value (web_form_class.js:119)
        at Object.callback (application-form:383)
        at Object.200 (website.js:79)
        at i (jquery.min.js:2)
        at Object.add [as done] (jquery.min.js:2)
        at Object.always (jquery.min.js:2)
        at Object.statusCode (jquery.min.js:4)
        at z (jquery.min.js:4)
        at XMLHttpRequest.<anonymous> (jquery.min.js:4)

Solved by bench build