SAP Webide系列（1）- 修复代码区域录入汉字异常_Java

一、背景

sap webide个人版上次更新时间还停留在2018年。针对产品出现的bug和优化方面，官方应该也不会再维护了，因为sap现在主推btp（business technology platform）里的bas（business application studio）开发工具以及vs code安装fiori tools插件实现fiori应用开发。

虽然但是，sap webide在笔者看来依旧是一个不错的开发工具，特别是在刚接触sap ui5开发时，此工具需配置的东西少，可离线开发，构建新项目迅速。

sap webide有一个被众多国内fiori开发顾问诟病的地方，就是针对汉字录入有问题，极其不友好。如下图是原版本的故障演示：

二、问题定位

通过ui5 inspector插件看到代码区域对应的控件是aceeditor，相当于封装的一个自定义控件，sap.watt.common.plugin.aceeditor.control.editor。（对js了解多的顾问可能根据名字就知道这个控件底层是做了什么，没错，就是基于开源库web编辑器ace.js封装的一个代码编辑器。不了解也没关系，接着往下分析。）

如果还不知道这个控件在webide的哪个路径，可以接着测试，在初次进入右侧代码编辑窗口时，会加载aceeditor的css，在网络请求中能看到具体路径。

（/webide/resources/sap/watt/ideplatform/plugin/aceeditor/css/aceeditor.css）

此时我们便可在自己电脑webide解压路径找到editor.js，和它在同目录下的lib文件夹里面也只有ace-noconflict。（无冲突的一个开源ace.js库）

我们现在可以验证是不是这个库出问题了，毕竟webide多年未维护，依赖库也没更新过。我们在ace-noconflict文件夹同路径建了一个testace.html文件，直接引用这个库生成代码编辑器。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>测试ace库</title>
</head>
<body>
	<div id="editor" style="position: absolute;width: 500px;height: 400px;">some text</div>
	<script src="./ace-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
	<script>ace.edit("editor");</script>
</body>
</html>