Device Selector missing in IDEA UI Preview

[DSeeLP]

Steps to Reproduce

Activate the new ui preview in IntelliJ IDEA and you will see that the device selector is missing. Note: I can run my app using flutter run in my terminal and if i deactivate the preview I can select my desktop as the device.

Version info

[✓] Flutter (Channel master, 3.1.0-0.0.pre.1841, on Fedora Linux 36 (Workstation Edition) 5.18.11-200.fc36.x86_64, locale de_DE.UTF-8)
    • Flutter version 3.1.0-0.0.pre.1841 on channel master at /mnt/Data/SDK/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision ea2396eca0 (vor 2 Stunden), 2022-07-25 06:12:06 -0400
    • Engine revision 1db83d265c
    • Dart version 2.19.0 (build 2.19.0-33.0.dev)
    • DevTools version 2.15.0

[✗] Android toolchain - develop for Android devices
    ✗ Unable to locate Android SDK.
      Install Android Studio from: https://developer.android.com/studio/index.html
      On first launch it will assist you in installing the Android SDK components.
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup for detailed instructions).
      If the Android SDK has been installed to a custom location, please use
      `flutter config --android-sdk` to update to that location.


[✗] Chrome - develop for the web (Cannot find Chrome executable at google-chrome)
    ! Cannot find Chrome. Try setting CHROME_EXECUTABLE to a Chrome executable.

[✓] Linux toolchain - develop for Linux desktop
    • clang version 14.0.0 (Fedora 14.0.0-1.fc36)
    • cmake version 3.22.2
    • ninja version 1.10.2
    • pkg-config version 1.8.0

[!] Android Studio (not installed)
    • Android Studio not found; download from https://developer.android.com/studio/index.html
      (or visit https://flutter.dev/docs/get-started/install/linux#android-setup for detailed instructions).

[✓] IntelliJ IDEA Ultimate Edition (version 2022.2)
    • IntelliJ at /home/dseelp/.local/share/JetBrains/Toolbox/apps/IDEA-U/ch-0/222.3345.90
    • Flutter plugin version 69.0.5
    • Dart plugin version 222.3345.108

[✓] Connected device (1 available)
    • Linux (desktop) • linux • linux-x64 • Fedora Linux 36 (Workstation Edition) 5.18.11-200.fc36.x86_64

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 3 categories.

[stevemessick]

It looks like we're blocked on toolbar customization: https://youtrack.jetbrains.com/issue/IDEA-287169

There is so much work to be done that it wouldn't be practical for us to start redesigning our UI at this point.

[stevemessick]

See also https://youtrack.jetbrains.com/issue/KTIJ-22301/newUI-breaks-Flutter-plugin-device-selector

[luckycreationsindia]

Any alternative to select device?

[stevemessick]

Two options come to mind:

• Use the standard UI, not the preview
• Run from the command line

[luckycreationsindia]

Two options come to mind:

• Use the standard UI, not the preview
• Run from the command line

The new update has changed the UI to new one. 2022.2 (Build #IU-222.3345.118)

Running from command line is only option left or I have to roll back to previous version of Intellij Idea

Edit: I don't know how but New Plugin (IntelliJ New UI) was installed and enabled automatically. I disabled that and now It's working perfectly with old UI.

[stevemessick]

If anyone else has trouble, here's the setting to use the old UI:

[luckycreationsindia]

If anyone else has trouble, here's the setting to use the old UI:

Note: This option is not available in stable version. You need to disable IntelliJ New UI to go back to old UI

[jinzw1993]

(Help | Find Action | 'Registry'), you will find ide.experimental.ui,cancel checked.

[qseworks]

Hi Guys , Please Note that the device selector was added in Intelij EAP 2022.3 . The Following Steps Should resolve the issue.

Step 1 : Right Click on the Area Next to run button , you should see a customize toolbar popup as shown below

Step 2 : Click on Add Action

Step 3 : Type in flutter.deviceSelector, select it , and press OK.

Step 4 : Hit Apply

Step 4 : Done. You should see it appear , Happy Coding !

[kennette21]

@qseworks i tried your fix as described. When you reopen the project, the device selector is available for a few seconds but disappears. This was the same behavior before I customized the toolbar as well.

I guess i will try to downgrade Intellij to before the UI update. I cannot find the New UI plugin or the toggle in preferences 😕 .

[Miuler]

Works for me!!! XD, thanks for this solution.

[azeek]

Official version of intellij with new UI is out. Now is the time to take care of this.

[kiratheone]

Issue still exist on Official version of intellij with new UI @azeek but @qseworks tips work for me.

[barees63]

Not working for me (MacOS, 2022.3), I don't have the flutter.DeviceSelector action either? Old UI still works.

[AlexV525]

Not working for me (MacOS, 2022.3), I don't have the flutter.DeviceSelector action either? Old UI still works.

If you can't find it through the search, it's still can be found in the below Plugin > Flutter.DeviceSelector.

[barees63]

Thanks @AlexV525! I found it there now, it wasn't there yesterday but I just received an update to the Dart plugin and now it's working fine.

[azeek]

The @qseworks tip can solve the problem, but the device.selector window should be displayed automatically even if the user doesn't care and uses it.

[stevemessick]

Just to be clear: the new UI is still in beta. It is not supported by the Flutter plugin yet. It can be turned off via a check box in the Appearance page of IntelliJ preferences/settings.

[uditrugman]

the device selector does not appear in the toolbar with the old UI. it appears for 1-2 seconds during startup and then disappears

[stevemessick]

@uditrugman Please create a separate issue, including the output of Tools > Flutter > Flutter Doctor. Also include repro steps, as the problem does not occur for me.

This problem is fixed in version 71.1, which is available now.

[pearlbob]

I use tcsh and typically launch idea from a desktop icon. Idea does not provide web (chrome) as a flutter device unless I set the desktop icon to launch a bash shell script that specifically exports CHROME_EXECUTABLE even though it's in the tcsh generated environment. I have the same issue when launching idea from the linux cinnamon main menu.

[bruno-unna]

I use tcsh and typically launch idea from a desktop icon. Idea does not provide web (chrome) as a flutter device unless I set the desktop icon to launch a bash shell script that specifically exports CHROME_EXECUTABLE even though it's in the tcsh generated environment. I have the same issue when launching idea from the linux cinnamon main menu.

I'm on the same boat here, except that:

• I'm using zsh (v 5.9-3 on ArchLinux).
• I don't use the distro-prepared IDE, but I downloaded directly from JetBrains. (v 2023.1 community edition - build #IC-231.8109.175).

At any rate, I find it very strange that the environment gets dropped when running the IDE application.

Should more information about my environment be needed or useful, please let me know.

[stevemessick]

@bruno-unna @pearlbob Your problem sounds like environment variables are not being defined in the right place. I don't know anything about tcsh or zsh but I'm familiar with csh and bash. Those two shells have a login environment and an interactive environment. IDEs see the login environment, not the interactive (command line shell) environment.

Check your shell docs to see if they make a similar distinction. If so, adjusting your login environment to have the settings you need should help.

[rvowles]

With the 2023.1 upgrade, this fix no longer works. I'm on Mac OS 13.X. I fact I can't even on the old UI.

[stevemessick]

@rvowles I'm using 2023.1.1 with plugin version 73.0.4 on MacOS 13.3.1. Everything works as expected. I did not have to manually edit the tool bar. If you need further help please open a new issue with more detail.