Need help from QUnit experts?

Question

Software testing

The crux of the matter is this.
There is an input field and a list of blocks
https://gyazo.com/b4a3386cb0651432dfc68e45e621b547
When you enter text in the field and press Enter, one block is added to the end of the list.
Used by Angular.
This is the code responsible for adding the element

$scope.ngCreate = function ($event) {
        if(window.event.key == "Enter"){
          if($scope.blur!="" && $scope.blur!=undefined && mapInit==1){
            var left_elements = angular.element(document.querySelector("body"));
            var left_elementsE = left_elements.find('.js-content_left__elements');				
            var newLi = angular.element("<li>");
            var newA = angular.element("<a>");
            newA.attr("href", "#");
            var newSpan = angular.element("<span>");
            newSpan.addClass("glyphicon");
            newSpan.addClass("glyphicon-remove");
            newSpan.addClass("pull-right");
            var newNumber=$("ul").find($("li")).length;
            newSpan.attr("data-id", newNumber+1);
            newSpan.attr("ng-click", "ngDelete("+(newNumber+1)+");");
            left_elementsE.append(newLi);
            newLi.append(newA);	
            newA.append($scope.blur);
            newA.append(newSpan);
            newSpan.on("click", function (e){
              var number=e.target.getAttribute("data-id");
              DeleteElement(number);
            });
            //добавление метки на карту
            Placemark=new ymaps.Placemark(myMap.getCenter(), {
              balloonContent: $scope.blur,
              iconContent: markers.length+1
            }, {
              preset: 'islands#Icon'+ markers.length+1,
              draggable: true
            });
            Placemark.events.add('drag', function (g) {
              var e = g.get('target');
              updatePolyline(e.properties._data.iconContent, e.geometry._coordinates);
            });	
            myMap.geoObjects.add(Placemark);	
            Placemarks.push(Placemark);	
            markers.push(myMap.getCenter());
            names.push($scope.blur);
            updatePolyline(markers.length, myMap.getCenter());
            $scope.blur = '';	
          }
        };
        if((Placemarks.length == markers.length)&&(markers.length == names.length)){
          return 1;	
        }else{
          return 0;	
        }
      }

Test for it:

var ctrl, ctrlScope, injector;

module("Testing the controller", {
    setup: function () {
        angular.module('map-app');
        injector = angular.injector(['ng', 'map-app']);
        ctrlScope = injector.get('$rootScope').$new();
        ctrl = injector.get('$controller')('ctrlMain', { $scope: ctrlScope });
        ctrlScope.model = {
      
        };
    },
    teardown: function () {

    }
});	

asyncTest("Test ngCreate", function() {
    setTimeout(function() {
        equal(true, ctrlScope.ngCreate());
        start();
    }, 8000);
});

The problem is that when the test is run, the value of the input field is empty and the Enter keypress event is not fired.
I need to somehow feed the filled input field and pressed key to the test, i.e. emulate user actions.
How should this be done? I need at least a rough sample test for a similar situation.

Answer 1

Found a solution.

asyncTest("Test ngCreate", function() {
    setTimeout(function() {
    
    $('input[type="text"]').val("Test");
    var e = $.Event("keyup", { keyCode: 13, key: "Enter" }); 
    ctrlScope.blur="Test";
    equal(true, ctrlScope.ngCreate(e));	
    start();
    }, 20000);
});