How to set crop box to full width and full height of the container preview(Cropper js)

Question

How to make cropper js cropBox equal to container size. In other words the cropbox area should be equal to the available area of the preview height and width.

Answer 1

A better solution maybe setting autoCropArea as 1

{ autoCropArea: 1}

Answer 2

I found the solution a while ago, and I just realized that I had not answered this question.

The way I managed to set the full width was:

var image = document.getElementById('image');
var cropper = new Cropper(image, {
  aspectRatio: 16 / 9,
  crop: function(e) {
    console.log(e.detail.width);
    console.log(e.detail.height);

  }
});

var contData = cropper.getContainerData(); //Get container data
cropper.setCropBoxData({ height: contData.height, width: contData.width  }) //set data