王牌编辑器宽度改变会丢失内容

Question

我需要能够改变我的ace编辑器的宽度。之后用户已经将代码放入其中。然而，当我改变保存编辑器的div的宽度时，文本并没有被包裹到更薄的宽度中，你只是看不到它了（见 https:/jsfiddle.net0d4whvsq1)

var editor = ace.edit("ace_editor_div");
editor.getSession().setUseWorker(false);

editor.setOptions({
	maxLines: 50,
	minLines: 30,
	tabSize:2,
	wrap:true,
});
//editor.$blockScrolling = Infinity;
editor.setValue("this is meant to be too much text for the width of the editor once the width is made smaller.")
$("#shrink_button").on("click",function(){
	$("#ace_editor_div").css("width","200px");
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.11/ace.min.js"></script>
<script
  src="https://code.jquery.com/jquery-3.5.1.min.js"
  integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
  crossorigin="anonymous"></script>
<button id="shrink_button">
shrink</button>
</button>
<div id="ace_editor_div"></div>

从上面的例子可以看出，我在缩小编辑器时丢失了很多文字! 我看不到任何与宽度相关的基本设置来解决这个问题，我是不是漏掉了一个简单的方法，让所有的文字在调整大小后保留在编辑器中？我目前想的是可以在调整大小后重新创建整个编辑器，但这显然不理想。

先谢谢你了