Describe the bug
I used an other/old version of Ace for Vaadin Flow. Now I changed everything to Ace 1.3.4. It looks much more complete and is based in lit and I like it! The problem is, that in Chrome (96.0.4664.110 on OSX) and also in Brave (Version 1.34.80, Chromium: 97.0.4692.71 on OSX) the Component seems to not be really ready. It does not have syntax highlightning and also I noticed, it does not have a border.

It does not change anything if I call the Ace Menu (Cmd,) and change e.g. the syntax.

It is okay - with syntax highlightning and a border - after I switch views in my application. This switch sets components (parents of parents of the Ace Editor) unvisibel and visible again.

In Firefox the problem does not occur at all.

To Reproduce
If needed I can try to create a Vaadin App to reproduce?

Screenshots
Not working:

After switching views to an other and back:

Desktop (please complete the following information):

• Chrome (96.0.4664.110 on OSX)
• Brave (Version 1.34.80, Chromium: 97.0.4692.71)

Hi

I was told this is using polymer 2 and so it cannot be used in Vaadin 24. If so, when you find time, could you please let this also work for Vaadin 24. My application is heavily dependent on this wonderful editor and I can move that application to V24 only if this editor works in V24.

Currently the use of custom auto completion removes the 'keyWordCompleter' and 'snippetCompleter' from completers array and only 'staticWordCompleter' is used (lit-ace.js). Would it be possible to add another parameter to 'setCustomAutoCompletion' methods by which users can decide to keep the 'keyWordCompleter' and 'snippetCompleter' or maybe add methods like 'addCustomAutoCompletion' which would keep the 'keyWordCompleter' and 'snippetCompleter' and add the custom one?

Describe the bug
Editor shows but without theme / mode

To Reproduce

1. Use Vaadin Start to create an app with security on some views
2. Change Vaadin context to "myapp".
3. Add aceEditor to any secure view.

    @Bean
    public ServletRegistrationBean frontendServletBean() {
        ServletRegistrationBean bean = new ServletRegistrationBean<>(new VaadinServlet() {
            @Override
            protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
                if (!serveStaticOrWebJarRequest(req, resp)) {
                    resp.sendError(404);
                }
            }
        }, "/myapp/frontend/*");
        bean.setLoadOnStartup(1);
        return bean;
    }

  markdownEditor = new AceEditor();
  markdownEditor.setShowGutter(true);
  markdownEditor.setVisible(true);
  markdownEditor.setAutoComplete(false);
  markdownEditor.setInitialFocus(true);
  markdownEditor.setUseWorker(true);
  markdownEditor.setHighlightActiveLine(true);
  markdownEditor.setHighlightSelectedWord(true);
  markdownEditor.setMode(AceMode.markdown);
  markdownEditor.setTheme(AceTheme.chrome);
  markdownEditor.setWidthFull();
  markdownEditor.setWrap(true);
  add(markdownEditor);

@EnableWebSecurity
@Configuration
public class AppSecurityConfiguration extends VaadinWebSecurityConfigurerAdapter {

    public static final String LOGOUT_URL = "/";
    private static final RequestMatcher PROTECTED_URLS = new OrRequestMatcher(new AntPathRequestMatcher("/myapp/**"));
    private static final RequestMatcher PUBLIC_URLS = new NegatedRequestMatcher(PROTECTED_URLS);

	...
	
    @Override
    protected void configure(HttpSecurity http) throws Exception {
        super.configure(http);
        setLoginView(http, LoginView.class, LOGOUT_URL);
    }

    @Override
    public void configure(WebSecurity web) throws Exception {
        super.configure(web);
        web.ignoring().requestMatchers(PUBLIC_URLS);
    }
}    

Screenshots

Desktop:

• OS: MacOS Monterey
• Browser Safari & Firefox

Vaadin + Spring

• Vaadin: 23.0.7
• Spring boot: 2.6.7

Additional context

• Vaadin context is "myapp"

Browser console output

• Loading failed for the <script> with source “http://localhost:8080/myapp/ace-builds/src-min-noconflict/theme-chrome.js”.
• Loading failed for the <script> with source “http://localhost:8080/myapp/ace-builds/src-min-noconflict/mode-markdown.js”.
• The resource from “http://localhost:8080/myapp/ace-builds/src-min-noconflict/theme-chrome.js” was blocked due to MIME type (“”) mismatch (X-Content-Type-Options: nosniff).
• The resource from “http://localhost:8080/myapp/ace-builds/src-min-noconflict/mode-markdown.js” was blocked due to MIME type (“”) mismatch (X-Content-Type-Options: nosniff).

Fix attempt
Adding baseUrl to security white list but without success:

• /myapp/ace-builds/src-min-noconflict/**
• /myapp/ace-builds/**

    @Override
    public void configure(WebSecurity web) throws Exception {
        super.configure(web);
        web.ignoring().requestMatchers(PUBLIC_URLS).antMatchers("/myapp/ace-builds/src-min-noconflict/**");
    }

Error in console changed to:

• Loading failed for the <script> with source “http://localhost:8080/myapp/ace-builds/src-min-noconflict/theme-chrome.js”.
• Loading failed for the <script> with source “http://localhost:8080/myapp/ace-builds/src-min-noconflict/mode-markdown.js”.

Hi @F0rce,
Sorry to bother you but we found another issue. The search feature doesn't work.

Editor doesn't respond to CMD+F or CTRL+F shortcut. It was working in 1.0.1 version.

Could you please check it?

Thx
JS

Hi @F0rce,
We have upgraded to the new version 1.2.3 with Vaadin 14.5.6. Everything works but search. When I press CMD+F javascript error is thrown that

GET http://localhost:8091/ace-builds/src-min-noconflict/ext-searchbox.js net::ERR_ABORTED 404

Could it be related with the last change (make baseUrl relative?). Themes and modes works good and from what I see they are "loaded" from compiled bundle, but this extension is loaded directly not from bundle...

Thx
JS

Describe the bug
When trying to select text bachward from some point, the selection becomes invalid when crossing the line. This happens either by using keyboard or mouse.

To Reproduce

1. Write something like

select *
from   dataset
where  age > 30

2. Set cursor position to end of text.
3. Press shift and up key or start selecting with mouse upward.

Screen recording
https://user-images.githubusercontent.com/13315108/115686442-7b3dda00-a359-11eb-9641-336254de64f6.mp4

Describe the bug
Lit-ace not interpreted on Vaadin23

To Reproduce
Steps to reproduce the behaviour:

1. Create a project with a blank page with https://start.vaadin.com/app
2. Go to the blank page code and add

AceEditor ace = new AceEditor();
ace.setTheme(AceTheme.terminal);
ace.setMode(AceMode.sql);
ace.setValue("SELECT * FROM DB_01 WHERE ID = 123");
add(ace);

4. Start the application
5. If you check the DOM the component is present but not interpreted

Desktop (please complete the following information):

• OS: W11
• Browser chromium based

Describe the bug
We we build for production it looks like webpack does no create a minified version of the js dependencies.

To Reproduce
Steps to reproduce the behavior:

<profile>
    <!-- Production mode is activated using -Pproduction -->
    <id>production</id>
    <build>
        <plugins>
            <plugin>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-maven-plugin</artifactId>
                <version>${vaadin.version}</version>
                <executions>
                    <execution>
                        <goals>
                            <goal>build-frontend</goal>
                        </goals>
                        <phase>compile</phase>
                    </execution>
                </executions>
                <configuration>
                    <productionMode>true</productionMode>
                </configuration>
            </plugin>
        </plugins>
    </build>
</profile>

mvn -Pproduction verify -DskipITs=true -Dmaven.repo.local=.m2/

No changes were made to the default vaadin webpack.config.js

const merge = require('webpack-merge');
const flowDefaults = require('./webpack.generated.js');

module.exports = merge(flowDefaults, {

});

Error messages

[BABEL] Note: The code generator has deoptimised the styling of /Users/*ProjectPath*/node_modules/ace-builds/src-noconflict/ace.js as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of /Users/*ProjectPath*/node_modules/ace-builds/src-noconflict/ace.js as it exceeds the max of 500KB.

Screenshots
https://imgur.com/a/u5N95Gs

Describe the bug
aceEditor.setPlaceholder("some text"); is not working,Not showing up
I tried version 1.3.1 and 1.3.2

What I would like to achieve is that the editor is started with a line size of e.g. 6. But if the user then enters more text, the editor should grow vertically up to a maximum number of lines. Ace basically supports this with the options minLines and maxLines. (it the same function the editor has on the landing page of https://ace.c9.io/)

It would be nice to be able to use these Ace functions directly. I think additionally the editor div would have to change from position:absolute to position:static for this case?

Describe the bug
Theme update not working

To Reproduce
Steps to reproduce the behavior:

1. initialize editor
2. try to update theme from server side

Expected behavior
Theme should change. In reality, it just remains the old eclipse theme.

Maybe there is some event that needs to be fired to update the editor's theme on the client side? If I figure it out, I will PR. Thanks for updating this editor for v14.

Describe the bug
When calling AceEditor#sync the java.lang.IllegalAccessException is thrown when Vaadin is trying to construct AceForceSyncDomEvent.

To Reproduce
Just calling AceEditor#sync causes the exception:

java.lang.IllegalAccessException: class com.vaadin.flow.component.ComponentEventBus cannot access a member of class de.f0rce.ace.AceForceSyncDomEvent with modifiers "public"

Exception

Unable to create an event object of type de.f0rce.ace.AceForceSyncDomEvent

StackTrace:
java.lang.IllegalArgumentException: 
	at com.vaadin.flow.component.ComponentEventBus.createEventForDomEvent(ComponentEventBus.java:415)
	at com.vaadin.flow.component.ComponentEventBus.handleDomEvent(ComponentEventBus.java:372)
	at com.vaadin.flow.component.ComponentEventBus.lambda$addDomTrigger$dd1b7957$1(ComponentEventBus.java:264)
	at com.vaadin.flow.internal.nodefeature.ElementListenerMap.lambda$fireEvent$2(ElementListenerMap.java:441)
	at java.base/java.util.ArrayList.forEach(ArrayList.java:1540)
	at com.vaadin.flow.internal.nodefeature.ElementListenerMap.fireEvent(ElementListenerMap.java:441)
	at com.vaadin.flow.server.communication.rpc.EventRpcHandler.handleNode(EventRpcHandler.java:59)
	at com.vaadin.flow.server.communication.rpc.AbstractRpcInvocationHandler.handle(AbstractRpcInvocationHandler.java:64)
	at com.vaadin.flow.server.communication.ServerRpcHandler.handleInvocationData(ServerRpcHandler.java:410)
	at com.vaadin.flow.server.communication.ServerRpcHandler.lambda$handleInvocations$1(ServerRpcHandler.java:391)
	at java.base/java.util.ArrayList.forEach(ArrayList.java:1540)
	at com.vaadin.flow.server.communication.ServerRpcHandler.handleInvocations(ServerRpcHandler.java:391)
	at com.vaadin.flow.server.communication.ServerRpcHandler.handleRpc(ServerRpcHandler.java:318)
	at com.vaadin.flow.server.communication.UidlRequestHandler.synchronizedHandleRequest(UidlRequestHandler.java:114)
	at com.vaadin.flow.server.SynchronizedRequestHandler.handleRequest(SynchronizedRequestHandler.java:40)
	at com.vaadin.flow.server.VaadinService.handleRequest(VaadinService.java:1556)
	at com.vaadin.flow.server.VaadinServlet.service(VaadinServlet.java:299)
	at com.vaadin.flow.spring.SpringServlet.service(SpringServlet.java:109)
	at javax.servlet.http.HttpServlet.service(HttpServlet.java:733)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:227)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.apache.catalina.core.ApplicationDispatcher.invoke(ApplicationDispatcher.java:710)
	at org.apache.catalina.core.ApplicationDispatcher.processRequest(ApplicationDispatcher.java:457)
	at org.apache.catalina.core.ApplicationDispatcher.doForward(ApplicationDispatcher.java:352)
	at org.apache.catalina.core.ApplicationDispatcher.forward(ApplicationDispatcher.java:312)
	at org.springframework.web.servlet.mvc.ServletForwardingController.handleRequestInternal(ServletForwardingController.java:141)
	at org.springframework.web.servlet.mvc.AbstractController.handleRequest(AbstractController.java:177)
	at org.springframework.web.servlet.mvc.SimpleControllerHandlerAdapter.handle(SimpleControllerHandlerAdapter.java:52)
	at org.springframework.web.servlet.DispatcherServlet.doDispatch(DispatcherServlet.java:1060)
	at org.springframework.web.servlet.DispatcherServlet.doService(DispatcherServlet.java:962)
	at org.springframework.web.servlet.FrameworkServlet.processRequest(FrameworkServlet.java:1006)
	at org.springframework.web.servlet.FrameworkServlet.doPost(FrameworkServlet.java:909)
	at javax.servlet.http.HttpServlet.service(HttpServlet.java:652)
	at org.springframework.web.servlet.FrameworkServlet.service(FrameworkServlet.java:883)
	at javax.servlet.http.HttpServlet.service(HttpServlet.java:733)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:227)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:53)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.tuckey.web.filters.urlrewrite.RuleChain.handleRewrite(RuleChain.java:176)
	at org.tuckey.web.filters.urlrewrite.RuleChain.doRules(RuleChain.java:145)
	at org.tuckey.web.filters.urlrewrite.UrlRewriter.processRequest(UrlRewriter.java:92)
	at org.tuckey.web.filters.urlrewrite.UrlRewriteFilter.doFilter(UrlRewriteFilter.java:389)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.springframework.security.web.FilterChainProxy.doFilterInternal(FilterChainProxy.java:204)
	at org.springframework.security.web.FilterChainProxy.doFilter(FilterChainProxy.java:183)
	at org.springframework.web.filter.DelegatingFilterProxy.invokeDelegate(DelegatingFilterProxy.java:358)
	at org.springframework.web.filter.DelegatingFilterProxy.doFilter(DelegatingFilterProxy.java:271)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.springframework.web.filter.RequestContextFilter.doFilterInternal(RequestContextFilter.java:100)
	at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerRequestFilter.java:119)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.springframework.web.filter.FormContentFilter.doFilterInternal(FormContentFilter.java:93)
	at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerRequestFilter.java:119)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.springframework.web.filter.CharacterEncodingFilter.doFilterInternal(CharacterEncodingFilter.java:201)
	at org.springframework.web.filter.OncePerRequestFilter.doFilter(OncePerRequestFilter.java:119)
	at org.apache.catalina.core.ApplicationFilterChain.internalDoFilter(ApplicationFilterChain.java:189)
	at org.apache.catalina.core.ApplicationFilterChain.doFilter(ApplicationFilterChain.java:162)
	at org.apache.catalina.core.StandardWrapperValve.invoke(StandardWrapperValve.java:202)
	at org.apache.catalina.core.StandardContextValve.invoke(StandardContextValve.java:97)
	at org.keycloak.adapters.tomcat.AbstractAuthenticatedActionsValve.invoke(AbstractAuthenticatedActionsValve.java:67)
	at org.apache.catalina.authenticator.AuthenticatorBase.invoke(AuthenticatorBase.java:542)
	at org.keycloak.adapters.tomcat.AbstractKeycloakAuthenticatorValve.invoke(AbstractKeycloakAuthenticatorValve.java:181)
	at org.apache.catalina.core.StandardHostValve.invoke(StandardHostValve.java:143)
	at org.apache.catalina.valves.ErrorReportValve.invoke(ErrorReportValve.java:92)
	at org.apache.catalina.core.StandardEngineValve.invoke(StandardEngineValve.java:78)
	at org.apache.catalina.connector.CoyoteAdapter.service(CoyoteAdapter.java:357)
	at org.apache.coyote.http11.Http11Processor.service(Http11Processor.java:374)
	at org.apache.coyote.AbstractProcessorLight.process(AbstractProcessorLight.java:65)
	at org.apache.coyote.AbstractProtocol$ConnectionHandler.process(AbstractProtocol.java:893)
	at org.apache.tomcat.util.net.NioEndpoint$SocketProcessor.doRun(NioEndpoint.java:1707)
	at org.apache.tomcat.util.net.SocketProcessorBase.run(SocketProcessorBase.java:49)
	at java.base/java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1128)
	at java.base/java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:628)
	at org.apache.tomcat.util.threads.TaskThread$WrappingRunnable.run(TaskThread.java:61)
	at java.base/java.lang.Thread.run(Thread.java:834)
Caused by: java.lang.IllegalAccessException: class com.vaadin.flow.component.ComponentEventBus cannot access a member of class de.f0rce.ace.AceForceSyncDomEvent with modifiers "public"
	at java.base/jdk.internal.reflect.Reflection.newIllegalAccessException(Reflection.java:361)
	at java.base/java.lang.reflect.AccessibleObject.checkAccess(AccessibleObject.java:591)
	at java.base/java.lang.reflect.Constructor.newInstance(Constructor.java:481)
	at com.vaadin.flow.component.ComponentEventBus.createEventForDomEvent(ComponentEventBus.java:409)
	... 81 more

The 'getCursorPosition' is relying on server values stored in AceEditor.cursorPosition and those are not updated after mouse or keyboard events change the cursor position. The possible solutions:

1. Enhance the 'sync' method so it would also update 'cursorPosition' and 'selection' and clients would be responsible for synchronisation before usage.
2. Implemented automatic synchronisation of server values after mouse and keyboard events.
3. Implemented automatic synchronisation of server values after mouse events and track key events and update 'cursorPosition' accordingly.

As far as I'm concerned the proposal 1. would be a necessity, even if other other solution is also implemented, since data is allready being transfered and adding couple of fields wouldn't do much harm. The additional values should behave same as 'editor-blur' event values.

It also seems like the update of cursor position is not updated properly after 'editor-blur' event since it always retuns same values in array. More specificaly it returns [column,column].

Describe the bug
I tried to add more than one custom auto completion category by calling the method several times. But only the last call is transfered to the client side.

To Reproduce
Add the following code:

AceEditor aceEditor = new AceEditor();
aceEditor.setMode(AceMode.sql);
aceEditor.setCustomAutocompletion(Arrays.asList("User", "Role"), "table", true);
aceEditor.setCustomAutocompletion(Arrays.asList("FullName", "Address", "Right"), "column", true);
aceEditor.setAutoComplete(true);

Expected behavior
I expect that auto complete shows all values, but only values with category "column" are shown.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10
• Browser: Chrome
• Version: 3.3.3

Additional context
Vaadin version 23.1.

Describe the solution you'd like
Change the dispatching of the events (blur, selection, sync) in frontend (https://github.com/f0rce/lit-ace) to also include a calculation (by myself) of the absolute index of cursor and the absoulte indicies of the selection (from - to)

Describe the bug
For some reason with Vaadin 14.6.1 and v1.2.1 of this plugin I am getting a strange ArrayStoreException: de.f0rce.ace.AceEditor
when doing either

AceEditor textArea = new AceEditor();
add(textArea); // 'add()' takes a vararg of Components which is internally an array

or

Component c[] = new Component[] {null};
c[0] = textArea; // ArrayStoreException: de.f0rce.ace.AceEditor - WHAT THE HECK???

In my IDE AceEditor is shown as an indirect subclass of Component - so something strange is going on.
Not sure if its a Java8 / 11 byte code incompatibility or whether something is wrong with my setup (I used it successfully with other third party vaadin components).

I am also getting the exception when I install the F0rce/ace plugin from source with mvn clean install.

Maybe anyone has seen a similar issue before?

To Reproduce
I created a minimal setup here together with comments on how to run it and the stacktraces it produces: https://github.com/Aklakan/vaadin-ace-editor-issue

Expected behavior
Adding the AceEditor to a layout or assigning it as an element to an array of type Component should work successfully.

Desktop (please complete the following information):

• OS: Ubuntu 20.04 - open-jdk-11

Describe the bug
AceEditor not showing up in the UI

To Reproduce
Steps to reproduce the behavior:

1. Download vaadin starter application with v23.1.1
2. Add AceEditor to the a page/view like

AceEditor aceEditor = new AceEditor();
aceEditor.setSizeFull();
add(aceEditor); //Add it to a layout

Run the project and open the browser

Expected behavior
Show AceEditior in the view

Screenshots

Desktop (please complete the following information):

• OS: Windows
• Browser [e.g. chrome, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

Describe the bug
The first time we call AceEditor#focus does nothing and (TypeError) : Cannot read property 'focus' of undefined is displayed by Vaadin. The editor is already attached but has not been rendered yet. Calling focus works on subsequent calls.

Looks like problem in lit-ace.js. focusEditor method istrying to call this.editor.focus() while this.editor is undefined. this.editor is lazily initialized in firstUpdated. Could the initialization be moved to constructor? The same error happens when calling setCursorPosition before firstUpdated .

To Reproduce
Clicking on tabs of class described below causes the error.

Tab tab1 = new Tab("Tab1");
Tab tab2 = new Tab("Tab2");
tabs = new Tabs();
tabs.add(tab1, tab2);

Div div = new Div();
AceEditor aceEditor = new AceEditor();
aceEditor.setInitialFocus(true);
aceEditor.setVisible(false);

VerticalLayout layout = new VerticalLayout();
layout.add(tabs, div, aceEditor);
tabs.addSelectedChangeListener(e -> {
	if (div.isVisible()) {
		div.setVisible(false);
		aceEditor.setVisible(true);
		aceEditor.focus();
	} else {
		div.setVisible(true);
		aceEditor.setVisible(false);
	}
});

Screenshot

Describe the bug
Mouse events fully ignored inside completion popup. For example scrolling by mouse wheel not works, hovering not works

To Reproduce

1. Download example-project.zip
2. Run class 'Application'
3. Open view -> press 'Open Dialog'
4. Press CTRL + Space
5. Now you see java completion items
6. Try to scroll them by mouse - popup will be force closed

Expected behavior
Scroll completion variants by mouse, scrolling by UP/Down works as expected

Desktop:

• OS: Windows 10
• Browser: Chrome,Firefox
• Version: 120,121

Since version 2.1.1 this Componenet can no longer be compiled because Error: Can't resolve 'lit-html/is-server.js'

The error occurs in all subsequent versions for Vaadin 14.

Seit der Version 2.1.1 ist diese Componenet nicht mehr kompilierbar, weil Error: Can't resolve 'lit-html/is-server.js'

Der fehler tritt in allen nachfolgeden Version für Vaadin 14 auf.

ERROR [dev-webpack] (webpack) [38;5;196mERROR in ../node_modules/.pnpm/[email protected]/node_modules/lit/index.js[0m
ERROR [dev-webpack] (webpack) [38;5;196mModule not found: Error: Can't resolve 'lit-html/is-server.js' in ...'/node_modules/.pnpm/[email protected]/node_modules/lit'[0m
ERROR [dev-webpack] (webpack) [38;5;196m @ ../node_modules/.pnpm/[email protected]/node_modules/lit/index.js 1:87-122 1:87-122[0m
ERROR [dev-webpack] (webpack) [38;5;196m @ ../node_modules/@vaadin/flow-frontend/@f0rce/lit-ace/lit-ace.js[0m
ERROR [dev-webpack] (webpack) [38;5;196m @ ../target/frontend/generated-flow-imports.js[0m
ERROR [dev-webpack] (webpack) [38;5;196mℹ ｢wdm｣: Failed to compile.[0m

Hi @F0rce,
We are using the most recent version of the Ace editor and we noticed that the themes and modes don't work.

We haven't noticed it at first place as it works correctly in dev mode, but it doesn't work in production.

It seems to be issue with assets loading as there are information in JS console:

Failed to load resource: the server responded with a status of 500 ()
Refused to execute https://app.cnc.dev.solar.ms/ace-builds/src-min-noconflict/theme-eclipse.js as script because "X-Content-Type-Options: nosniff" was given and its Content-Type is not a script MIME type.

Before we upgraded to version 1.2.1 everything was ok. Unfortunately the version 1.0.1 is no available anymore so we can't revert back to it.

Could you please check it out?

Best regards,
JS

Hi @F0rce,
I updated to the new 1.2.0 version. UI built up correctly and the component showed up correctly. But I don't get the value from client back to server (doesn't matter if it is connected to binder or not).

Could you please check it up?

Thank you
J

Whenever I use version 1.1.0 of this plugin with Vaadin 14.5.2 the compilation doesn't work (Client compilation)
It seems that js files are not found by Vaadin compiler - there are many errors like following:

ERROR in ../node_modules/.pnpm/[email protected]/node_modules/ace-builds/webpack-resolver.js?babel-target=es6 Module not found: Error: Can't resolve './src-noconflict/snippets/nginx.js&babel-target=es6' in '/***PATH_TO_WORKING_DIR***/node_modules/.pnpm/[email protected]/node_modules/ace-builds' @ ../node_modules/.pnpm/[email protected]/node_modules/ace-builds/webpack-resolver.js?babel-target=es6 343:46-118 @ ../node_modules/.pnpm/@f0rce/[email protected][email protected]/node_modules/@f0rce/lit-ace/lit-ace.js?babel-target=es6 @ ../target/frontend/generated-flow-imports.js?babel-target=es6

All Vaadin dependencies in our application are provided by common maven parent - the same parent that provides ace plugin dependency.

Version 1.0.1 works with Vaadin 14.5.2 correctly.

Compilation fails even in building environment so it's not the matter of cache or incorrect node_modules folder.

Describe the bug
AceEditor not showing up in the UI / collapses to a thin line.

To Reproduce
Steps to reproduce the behavior:

Download vaadin starter application with v24

Add AceEditor to the a page/view like

AceEditor aceEditor = new AceEditor();
aceEditor.setSizeFull();
add(aceEditor); //Add it to a layout

Run the project and open the browser

Every dynamic height will cause the problem:

AceEditor aceEditor = new AceEditor();
aceEditor.setHeight("90%");
add(aceEditor);

Expected behavior
Show AceEditior in the view fully blown to the browser.

Screenshots

See #31

Desktop (please complete the following information):

• OS: macOS
• Browser chrome
• Version 24.3.5

Additional context
See pom [https://github.com/mhus/kt2l/blob/first_research/pom.xml]

Description
The Webpage docs.f0rce.de/ace is offline.

Reproduce
Steps to reproduce the behavior:

1. Open your favorite Browser
2. Enter docs.f0rce.de/ace
3. Press Enter
4. See error

Expected behavior
A really beautifulö and helpful documentation should appear.

Screenshots

Desktop (please complete the following information):

• OS: Windows 10 Pro
• Browser Brave (Chromium, newest)

Additional context
Thanks for the amazing work on this addon! I hab struggle with the implentation, because of the offline documentation page, but with looking into the source of the documentation I got it to work like I want! :)

Describe the bug
When I select a text in the ace editor and type a new text the first character is at the last position.

To Reproduce
Steps to reproduce the behavior:

• In the aceeditor, type "CONTENT"
• Select the text "CONTENT", type "123456"
• The result is "234561"

Expected behavior
The result should be: "123456"

Screenshots
https://user-images.githubusercontent.com/51313578/116244662-ce0bfd00-a770-11eb-9965-56dc1f1b7a0f.mov

I've got this issue in Vaadin 14.5.3 + v1.1.0.

But also when I pull the master branch and run mvn jetty:run

Describe the bug

I have a Vaadin CustomField that wraps an AceEditor - very straightforward.

In order to keep the CustomField's value up-to-date, I register a listener.

It looks something like this:

public class JavascriptField extends CustomField<String> {

    private final AceEditor ace = new AceEditor();

    public JavascriptField() {
        this.ace.setMode(AceMode.javascript);
        this.ace.setTheme(AceTheme.chrome);
        this.ace.setShowPrintMargin(false);
        this.ace.addAceChangedListener(e -> this.updateValue());
        this.add(ace);
    }

// CustomField

    @Override
    protected String generateModelValue() {
        return this.ace.getValue();
    }

    @Override
    protected void setPresentationValue(String newValue) {
        this.ace.setValue(newValue);
    }

    ...

The bug is that when a listener notification comes, the event value e.getValue() is up-to-date with whatever was just entered into the GUI. However, then updateValue() is invoked (shown above), and (as documented by CustomField) it invokes generateModelValue() which invokes this.ace.getValue() (shown above) but then the value returned by this.ace.getValue() is out of date.

So the end result is that the CustomField always has a stale value.

All Vaadin notifications that I've encountered in the past are "up to date" in the sense that if you query the state directly from the event handler, that state is consistent, i.e., up-to-date, with respect to the change you're being notified about.

However AceEditor doesn't seem to provide this guarantee, which seems like a bug.

To Reproduce

1. Register listener
2. Display e.getValue() and compare to this.ace.getValue()
3. Notice they are not the same

Expected behavior

When a listener is notified, this.ace.getValue() should always equal e.getValue().

Desktop (please complete the following information):

• OS: Mac OS 12.5
• Browser Firefox 103.0.1
• Add-on version 3.3.3

Describe the bug
After calling focus there should be a blinking cursor in the field but it seems like focus method doesn't have any effect.

Snippet To Reproduce the problem

public class TestEditor extends VerticalLayout {
    public TestEditor() {
        var ace = new AceEditor();
        addAndExpand(ace);
        ace.focus();
    }
}

I added the below dependency in pom.xml

<dependency>
            <groupId>de.f0rce</groupId>
            <artifactId>ace</artifactId>
            <version>1.1.0</version>
        </dependency>

It also have

<pluginRepositories>
        <!-- Main Maven repository -->
        <pluginRepository>
            <id>central</id>
            <url>https://repo.maven.apache.org/maven2</url>
            <snapshots>
                <enabled>false</enabled>
            </snapshots>
        </pluginRepository>
    </pluginRepositories>

    <repositories>
        <repository>
            <id>central</id>
            <url>https://repo.maven.apache.org/maven2</url>
            <snapshots>
                <enabled>false</enabled>
            </snapshots>
        </repository>
        <repository>
            <id>vaadin-addons</id>
            <url>https://maven.vaadin.com/vaadin-addons</url>
            <snapshots>
                <enabled>false</enabled>
            </snapshots>
        </repository>
        <repository>
            <id>Vaadin Directory</id>
            <url>https://maven.vaadin.com/vaadin-addons</url>
        </repository>
        <!-- Repository needed for prerelease versions of Vaadin -->
        <repository>
            <id>Vaadin prereleases</id>
            <url>https://maven.vaadin.com/vaadin-prereleases</url>
        </repository>
        <!-- Repository needed for the snapshot versions of Vaadin -->
        <repository>
            <id>vaadin-snapshots</id>
            <url>https://oss.sonatype.org/content/repositories/vaadin-snapshots/</url>
        </repository>

        <repository>
            <id>vaadin-addons</id>
            <url>https://maven.vaadin.com/vaadin-addons</url>
        </repository>
    </repositories>

I reloaded the project multiple files but still this is not getting downloaded. Not sure where is the issue.

The changed regex (from the original ace-repository) cause problems witin our application - point (".") added
var ID_REGEX = /[a-zA-Z_0-9$-\u00A2-\u2000\u2070-\uFFFF.]/;

1. Why is that point "." added within that regex on line 1367?

2. Should'nt the "." in the regex be escaped?

Hi,

I've been trying to add a custom mode for Cypher language, could please indicate how to import the additional file?

Hello, we really like your component and it works great in our project!

Faced a problem adding the label for the editor.
We would like to be able to add a label inside the component, so as not to create a wrapper div with a label and an editor inside.

Vaadin's core components implement the HasLabel interface with default getLabel()/setLabel() methods.
We tried to use this interface to extend the methods of the AceEditor class, but it did not work. It looks like it needs some extra interaction with the label property on the client side.

We are currently using version 2.3.1 for vaadin 14.

Thanks in advance for your response!