Unable to switch to Material theme or DARK mode

[tanbt]

• Minimal reproducible example

• In skeleton-starter-flow project, add @Theme on top of MainView class, e.g:

package com.vaadin.starter.skeleton;

import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.notification.Notification;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.router.Route;
import com.vaadin.flow.server.PWA;
import com.vaadin.flow.theme.Theme;
import com.vaadin.flow.theme.lumo.Lumo;
import com.vaadin.flow.theme.material.Material;

/**
 * The main view contains a button and a click listener.
 */
@Route("")
@PWA(name = "Project Base for Vaadin Flow", shortName = "Project Base")
@Theme(value = Material.class, variant = Material.LIGHT)
//@Theme(value = Lumo.class, variant = Lumo.DARK)
public class MainView extends VerticalLayout {

    public MainView() {
        Button button = new Button("Click me",
                event -> Notification.show("Clicked!"));
        add(button);
    }
}

• Expected behavior
  Themes and modes are switched respectively.

• Actual behavior
  Only Lumo theme and Lumo.LIGHT mode are used as default and cannot be changed.

• Versions:

  • Vaadin / Flow version: 14 beta1
  • Java version java version "1.8.0_202"
  • OS version Windows 10
  • Browser version (if applicable) Chrome