我正在尝试在 Vaadin 项目上设置 SuperDevMode。
我基本上有3个与此功能相关的问题。
我有以下小部件（使用“新 Vaadin 小部件”向导创建，位于客户端小部件、连接器、状态和服务器端组件的代码下方）：
// Widget:
public class CountedTextFieldWidget extends Composite {
private TextBox textBox = new TextBox();
private Label countLabel = new Label("0");
private HorizontalPanel panel = new HorizontalPanel();
public static final String CLASSNAME = "countedtextfield";
public CountedTextFieldWidget() {
initWidget(panel);
setStylePrimaryName(CLASSNAME);
textBox.setStylePrimaryName(CLASSNAME + "-field");
countLabel.setStylePrimaryName(CLASSNAME + "-label");
setStylePrimaryName(CLASSNAME);
panel.add(textBox);
panel.add(countLabel);
}
public String getText() {
return textBox.getText();
}
public void setText(String text) {
textBox.setText(text);
}
public void setCount(int count) {
countLabel.setText("" + count);
}
public int getCount() {
return Integer.parseInt(countLabel.getText());
}
// HandlerRegistration can be used to remove the key up handler (listener)
// added with this method
public HandlerRegistration addKeyUpHandler(KeyUpHandler handler) {
return textBox.addKeyUpHandler(handler);
}
}
/********************************************************/
// Connector:
@Connect(CountedTextField.class)
public class CountedTextFieldConnector extends AbstractComponentConnector {
public CountedTextFieldConnector() {
getWidget().addKeyUpHandler(new KeyUpHandler() {
@Override
public void onKeyUp(KeyUpEvent event) {
String text = getWidget().getText();
getWidget().setCount(text.length());
}
});
}
@Override
protected Widget createWidget() {
return GWT.create(CountedTextFieldWidget.class);
}
@Override
public CountedTextFieldWidget getWidget() {
return (CountedTextFieldWidget) super.getWidget();
}
@Override
public CountedTextFieldState getState() {
return (CountedTextFieldState) super.getState();
}
@Override
public void onStateChanged(StateChangeEvent stateChangeEvent) {
super.onStateChanged(stateChangeEvent);
final String text = getState().text;
getWidget().setText(text);
getWidget().setCount(text.length());
}
}
/********************************************************/
// State
public class CountedTextFieldState extends com.vaadin.shared.ui.textfield.AbstractTextFieldState {
{
primaryStyleName = null;
}
}
/********************************************************/
// Server-side component:
public class CountedTextField extends com.vaadin.ui.TextField {
@Override
public String getValue() {
return getState().text;
}
public void setValue(String value) {
getState().text = value;
}
@Override
public CountedTextFieldState getState() {
return (CountedTextFieldState) super.getState();
}
}
此小部件呈现如下：
现在，我在 Vaadin 的 wiki 上遵循了以下指南：
https://vaadin.com/wiki/-/wiki/Main/Using%20SuperDevMode
CodeServer 按预期启动：
The code server is ready.
Next, visit: http://localhost:9876/
但是当我打开项目并附?superdevmode加到 URL 时，得到Recompilation failed...消息并且浏览器的控制台中有一些错误：
所以我的第一个问题与这个问题有关：
1）为什么有时重新编译会失败？那些SEVERE: JSONP compile call failed和是SEVERE: Timeout Excecution什么？
然后，如果我... click to retry有时会启动 superdevmode，但自定义小部件没有像我发布的上一个屏幕截图那样呈现。相反，我得到了一个标准的 Vaadin 的 v-textfield ......
2）WTF...为什么？我的自定义组件在哪里？
我注意到如果我打开localhost:9876，我也会遇到同样的问题，将按钮拖到Dev Mode On书签工具栏，然后在打开时单击它localhost:8080/project。我的自定义小部件消失了，取而代之的是 Vaadin 的 v-textfield 小部件......
关于Enable Source Map功能。在 wiki 上，他们说：
为了能够在 Chrome 中调试 Java 代码，请打开 Chrome Inspector（右键单击 -> Inspect Element），单击窗口下角的设置图标并选中“Scripts -> Enable source maps”。在检查器打开的情况下刷新页面，您将在脚本选项卡中看到 Java 代码而不是 JavaScript 代码。
在我的 Chrome 中，窗口下角没有设置图标，我单击右侧的齿轮图标并转到General -> Sources并检查Enable JavaScript Source Map（我的设置选项卡上没有通用Enable source maps条目）。
我可以看到 Java 源代码，但它们都是 GWT 和 Vaadin 组件的源代码：
所以我的第三个问题和相关问题：
3) 我怎样才能看到我的自定义小部件代码？
感谢关注！希望我很清楚。