[Bug]: Apps UI not working in WebKit browsers (Safari, iOS/iPadOS, GNOME/Epiphany)

[BJKle]

⚠️ This issue respects the following points: ⚠️

• [X] This is a bug, not a question or a configuration/webserver/proxy issue.
• [X] This issue is not already reported on Github OR Nextcloud Community Forum (I've searched it).
• [X] Nextcloud Server is up to date. See Maintenance and Release Schedule for supported versions.
• [X] I agree to follow Nextcloud's Code of Conduct.

Bug description

When selection any app in the "your apps" "active apps" "disabled apps" section always the same app will be displayed. E.g. selection "Activity" -> "Versions" is displayed. Scrolling doesn't work as well.

Steps to reproduce

1. Open Apps
2. Select an app to manipulate
3. in my case "Versions" is displayed

Expected behavior

The selected app should be displayed to enable/disable

Installation method

None

Nextcloud Server version

28

Operating system

Debian/Ubuntu

PHP engine version

PHP 8.2

Web server

Nginx

Database engine version

MariaDB

Is this bug present after an update or on a fresh install?

Upgraded to a MAJOR version (ex. 22 to 23)

Are you using the Nextcloud Server Encryption module?

Encryption is Disabled

What user-backends are you using?

• [x] Default user-backend (database)
• [ ] LDAP/ Active Directory
• [ ] SSO - SAML
• [ ] Other

Configuration report

No response

List of activated Apps

No response

Nextcloud Signing status

No response

Nextcloud Logs

No response

Additional info

No response

[joshtrichards]

Hi @BJKle - I'm unable to reproduce this behavior. Can you try a different browser and/or device and/or disable extensions like ad blockers?

If it persists after that, please share what browser(s) and OSes you're seeing this behavior on. Thanks!

[tiptoptrash]

Hi @joshtrichards: I have the same problem. Using Safari on macOS Sonoma, iOS 14.2 and iPadOS 14.2, the problem ist present. Using Firefox on macOS Sonoma, the problem is not reproducible.

Affected are the list under "Your apps", "Active apps", "Disabled apps", "App bundles" and "Feautured apps". All those lists are static and cannot be scrolled. The other items starting with "Customization" behave totally normal.

I hope, that helps, thanks a lot!

[BJKle]

@joshtrichards I can't test another browser. Only safari is allowed on my system (macOS 14.2/M1). All others are blocked by admin.

Edit: @joshtrichards I tried it on someone else PC scrolling and selecting is working on Chrome. It seems to be a Safari specific Problem. I have Safari 17.2.1.

[BJKle]

No change with 28.0.1 😔

[derrickpeavy]

Can affirm:

Using Safari on macOS Monterey (12.7.1), Safari 17.1, the problem is present. Using Firefox on macOS Monterey (12.7.1), no problems.

This problem IS still present in NextCloud 28.0.1.

Pretty sure this is a CSS change that was introduced with 28.0.0.11, the list of apps will not scroll and clicking to enable or disable any app simply brings up an info panel on some other app which was not clicked.

[BJKle]

I tried different browsers (FF/Edge) on iOS/iPadOS and is not working as well. This really needs to get fixed.

[joshtrichards]

Reproduced successfully in GNOME Web (Epiphany) [V43 as distributed with Debian bookworm], which is also WebKit based just like all reported browser scenarios so far.

[BJKle]

I don't know where it belongs to, but must have to do with WebKit as well. In "Nextcloud Files" on a Mac I cannot "drag-and-drop" any file in Safari to my Cloud. I tried it in Firefox and it works.

[cloudguy23]

I'll add that Forms app is also affected. I'm able to create forms, complete, and share forms via Safari. However, a user will encounter an error - "There was an error submitting the form" - when submitting a form that was shared with them via Safari. Chrome, Brave, Firefox all work without issue.

[eweinhold]

Nextcloud 28.0.2 RC3 still not scrolling on safari :(

That not scrolling Bug persists in Nextcloud 28.0.2 RC3.

All Safari Browsers on all systems are affected Desktop, iPad, iPhone. Last Version and just updated current version 17.3 iOS and 14.3 macOS

[BJKle]

@joshtrichards can a developer at Nexctloud GmbH please patch this. It is really annoying. Thank you.

[eweinhold]

Nextcloud 28.0.2 RC3 still not scrolling on safari :(

That not scrolling Bug persists in Nextcloud 28.0.2 RC3.

All Safari Browsers on all systems are affected Desktop, iPad, iPhone. Last Version and just updated current version 17.3 iOS and 14.3 macOS

Nextcloud 28.0.2 RC4 still not scrolling :(

affected views: /index.php/settings/apps settings/apps/enabled settings/apps/disabled settings/apps/app-bundles settings/apps/featured settings/apps/search

the other apps views / preview Lists are not affected. they do scroll.

[eweinhold]

Nextcloud 28.0.2 RC5 not scrolling.

[eweinhold]

Nextcloud 28.0.2 release - this bug is still not fixed. :(

[joshtrichards]

@eweinhold Yes, that's why this issue is still open. If you want to help nudge things forward, the underlying cause needs to be identified before a fix can be made. So feel free to dig a bit into what might be causing this behavior.

[001101111011101101]

Can confirm the bug as of version 28.0.2 on Safari 17.3 (19617.2.4.11.8) It is affecting only the Apps section. The Administration Settings section behaves as expected.

[nicnab]

I'm not sure if this belongs in here as well but I updated a customer's Nextcloud instance to 28.0.2 last night and got the report from one (weekend working and rather tech savvy) user this morning that they can't upload files via safari anymore because when dropping a file, the "screen jumps around like crazy".

I don't have a Mac here so I can't confirm. In LibreWolf/Linux all works fine. In order to avoid bigger problems, I just downgraded to 27.1.6 via snapshot of the machine and, unfortunately, forgot to have the user send a screenshot of some kind. Maybe someone else with a Mac can confirm?

[001101111011101101]

I'm not sure if this belongs in here as well but I updated a customer's Nextcloud instance to 28.0.2 last night and got the report from one (weekend working and rather tech savvy) user this morning that they can't upload files via safari anymore because when dropping a file, the "screen jumps around like crazy".

I don't have a Mac here so I can't confirm. In LibreWolf/Linux all works fine. In order to avoid bigger problems, I just downgraded to 27.1.6 via snapshot of the machine and, unfortunately, forgot to have the user send a screenshot of some kind. Maybe someone else with a Mac can confirm?

Can confirm on Sonoma 14.3 with Safari 17.3 (19617.2.4.11.8)

[eweinhold]

I'm not sure if this belongs in here as well but I updated a customer's Nextcloud instance to 28.0.2 last night and got the report from one (weekend working and rather tech savvy) user this morning that they can't upload files via safari anymore because when dropping a file, the "screen jumps around like crazy". ...Maybe someone else with a Mac can confirm?

can confirm. Fileuploads with safari via drag&drop just result into heavy flickering (Drag&Drop UI Loading and showing and unloading disappearing) uploads via safari browser are not possible with drag and drop.

[BJKle]

@eweinhold @001101111011101101 See above. I mentioned it. We need a solution not a longer thread.

[tiptoptrash]

I'm not sure if this belongs in here as well but I updated a customer's Nextcloud instance to 28.0.2 last night and got the report from one (weekend working and rather tech savvy) user this morning that they can't upload files via safari anymore because when dropping a file, the "screen jumps around like crazy".

I don't have a Mac here so I can't confirm. In LibreWolf/Linux all works fine. In order to avoid bigger problems, I just downgraded to 27.1.6 via snapshot of the machine and, unfortunately, forgot to have the user send a screenshot of some kind. Maybe someone else with a Mac can confirm?

Here you go. Attached is a video showing that bug. Drag&Drop is completely unusable right now with Safari. I am very lucky that this is only my personal nextcloud instance and not the big instance I am administrating, too. I avoid Nextcloud 18 because I expect a flood of user complaints.

I hope that helps a bit to track down the problems.

Best greets!

https://github.com/nextcloud/server/assets/21986310/1b7861ae-414a-402c-b773-f4b95cae74b7

[BJKle]

again it is another issue. see https://github.com/nextcloud/server/issues/43135 a fix is linked in this issue. please don't spam this issue, which needs to be fixed

[eweinhold]

The Change that was made is the switch form a list of divs for the apps-list-container in NC27 to a html table in NC28 I guess some attributes of that old apps-list-container div do not work on a html table

works in safari

NC 27 apps-list-container as list of divs

dosen't work in safari

NC 28 apps-list-container as one html table

this switch to an HTML TABLE was only made on some settings pages - which all doesn't scroll on safari.

[BJKle]

Since we know the problem. Is there someone able to fix it?

[gcoretech]

As an example see: /settings/apps/installed/calendar That page is divided into three sections: the category on the left, the app list in the middle and the details of the selected app on the right.

The page seems to be generated by: https://github.com/nextcloud/server/blob/master/apps/settings/src/components/AppList/AppItem.vue

The following style is defined at the bottom of AppItem.vue:

.app-name--link::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

If you add background-color: yellow to that, the whole app list is yellow. Set content: 'X' and change position to relative, you will see just an X with yellow background right after every app name. The whole list is not yellow anymore and it's scrollable again.

I cannot fully test this because /apps/settings/src/components/AppList/AppItem.vue is not available on my nextcloud server. It seems to be added with webpack so it's not easy for me to test it.

Perhaps someone could try to remove .app-name--link::after from AppItem.vue and see if that fixes it.

[mhzawadi]

So I have this issue and have gone to test editing the /apps/settings/src/components/AppList/AppItem.vue file, but I dont have it on my server. My apps/settings/ is missing the src directory

Is that the issue that the file is missing?

[mhzawadi]

also the community zip file is missing the /apps/settings/src directory

[gcoretech]

@mhzawadi A nextcloud developer should have a look at this as those files are not part of a regular nextcloud installation. The code these files produce is seemingly packed/minified into javascript files that your nextcloud installation uses but it's hard to edit them directly because of the minification.

[mhzawadi]

Hey @gcoretech

I have the docker dev environment setup and working, I have edited .app-name--link::after to have yellow and can see it in Opera. But Safari is not yellow and still doesn't scroll.

[gcoretech]

Hey @mhzawadi background-color: yellow visualizes which area is affected in safari, scrolling works after changing position: absolute to position: relative.

This is from Safari developer tools (position changed to relative):

All apps in the app list now have an X with a red border and yellow background right after the app name and scrolling works:

Changing position back to absolute the whole app list is yellow and all the apps are behind the yellow pane so you can't see them. Imagine the picture above all yellow, without any text.

Hope this helps.