Listview Datatype Editing -> Missing "Order By" options when opened via infinite editor (10.2.0)

hfloyd commented 2 years ago

Which Umbraco version are you using? (Please write the exact version, example: 10.1.0)

10.2.0

Bug summary

When editing a Listview datatype via the Settings section, the "Order By" drop-down displays available properties, but when opening it for editing via the infinite editor (ex: Content Node > Info > Document Type [Open] > Listview Property [Edit] > Data Type [Edit]), the drop-down is empty.

Specifics

Steps to reproduce

Open a Listview datatype from the Content section:

Content Section
Node of a type including a Listview
Click on "Info" tab
Under "Document Type" click [Open]
Locate the Listview Property, click [Edit]
Click [Edit] on the Listview Data Type
Look at the "Order By" property.

Expected result / actual result

Available properties listed and available for selection.

github-actions[bot] commented 2 years ago

Hi there @hfloyd!

Firstly, a big thank you for raising this issue. Every piece of feedback we receive helps us to make Umbraco better.

We really appreciate your patience while we wait for our team to have a look at this but we wanted to let you know that we see this and share with you the plan for what comes next.

We'll assess whether this issue relates to something that has already been fixed in a later version of the release that it has been raised for.
If it's a bug, is it related to a release that we are actively supporting or is it related to a release that's in the end-of-life or security-only phase?
We'll replicate the issue to ensure that the problem is as described.
We'll decide whether the behavior is an issue or if the behavior is intended.

We wish we could work with everyone directly and assess your issue immediately but we're in the fortunate position of having lots of contributions to work with and only a few humans who are able to do it. We are making progress though and in the meantime, we will keep you in the loop and let you know when we have any questions.

Thanks, from your friendly Umbraco GitHub bot :robot: :slightly_smiling_face:

bjarnef commented 2 years ago

@hfloyd I can't reproduce this in v10.2.0

Tried both list view on document type and as property via infinite editing. Also seems to be the same for default list view and custom list views.

Do you see any console errors? Maybe try clear browser cache as well.

I had some JS errors after upgrading Development environment on Umbraco Cloud https://github.com/umbraco/Umbraco-CMS/issues/12978 but was fixed after a recycle.

hfloyd commented 2 years ago

Hi @bjarnef , Good idea -

Console does show 38 errors:

All are "TypeError: Cannot read properties of undefined (reading 'value')"

A hard-refresh on the page doesn't change anything. Opening a fresh (different) browser doesn't resolve it either.

I am working locally, so the whole machine has been shut down since the upgrade, and the app gets rebuilt / restarted multiple times a day... It's not a major issue, functionally, though I do wonder if there is something going on which is messing with the Angular which I should be concerned about...

bjarnef commented 2 years ago

@hfloyd if you click the first link at "umbraco.controllers" I think it should show you the part where it is trying to read value of undefined.

Does the specific project use other packages or any custom JS registered in backoffice like controllers for block list custom views, property editors etc.

hfloyd commented 2 years ago

Well, it seems the entire code file is on one line, so clicking the link doesn't provide much specific context... There are custom property editors installed (Contentment, Iconic, etc.) so perhaps that is causing the issue...

mrflo commented 2 years ago

I'm also facing issues with listview after upgrading to V10.2. It was working fine on 10.1.1 and have now similar errors in console even after clearing/disabling cache. It's only on the "enabled list view" doc type. As other custom list view as a property are still working fine. I then downgraded to 10.1.1 and it worked again. Just replacing the Umbraco folder in wwwroot did the trick. So seems really a JS issue. Difficult to see where in the JS it happens but here is the error if it helps:

umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:147 Error: [$controller:ctrlreg] http://errors.angularjs.org/1.8.3/$controller/ctrlreg?p0=Umbraco.Editors.Content.Apps.ListViewController
    at umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:25:168
    at umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:117:19
    at ea (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:99:20)
    at p (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:90:355)
    at g (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:84:186)
    at umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:83:311
    at Object.link (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:321:432)
    at umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:35:134
    at Ca (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:108:361)
    at p (umbraco-backoffice-js.js.vdd82ff30dfa645d0ad57f5ca7f269f9f57ac749c:92:340) '<div class="umb-editor-sub-view__content" ng-show="model.active === true" ng-include="model.view">'

elit0451 commented 1 year ago

Hi @hfloyd 👋 Thanks for pointing this out! I've tested it on Umbraco 10.3.2 (current latest) and I managed to reproduce the problem when:

I have a fresh Document Type;
The Document Type doesn't have list view enabled prior to adding a list view property (see video).

https://user-images.githubusercontent.com/21998037/204512115-941626cf-60a4-44c3-a556-1edfc4b05559.mp4

Once I "Enable list view", I no longer get the error.

hfloyd commented 1 year ago

Thanks, @elit0451 ! And congratulations on graduating and becoming a full-time Dev over there! 🎉✨

elit0451 commented 1 year ago

Ahhh, thank you very much, Heather! You are so nice 🤩🙏

kjac commented 1 year ago

@hfloyd thanks for reporting this 👍

Could you please elaborate on why the list view is added as a property on the content type rather than being enabled as a list view on the content type itself? I'm curious as to which use case the former approach is trying to solve 😄

For anyone interested and future reference, here are the docs for list views: https://docs.umbraco.com/umbraco-cms/fundamentals/backoffice/property-editors/built-in-umbraco-property-editors/listview

hfloyd commented 1 year ago

Hi @kjac - If you assign the Listview on the Doctype itself, it collapses the treeview of those nodes, so they aren't accessible via the tree, whereas, adding it via a property keeps the nodes navigable in the tree as well.

I occasionally add a Listview as a Property when I want to offer (in addition to the treeview access) a sortable list of the subnodes - possibly surfacing some property data in a tabular format for comparison purposes, etc. (If I want it to be easy to see when a sub node is missing a certain property value, etc.)

kjac commented 1 year ago

Thanks @hfloyd, that puts some perspective to the issue.

The list view is not really supposed to be used as a property editor but rather as documented in the docs (link above). That being said, if someone can fix this, we'd surely appreciate the help.

The JS error happens here: https://github.com/umbraco/Umbraco-CMS/blob/v11/contrib/src/Umbraco.Web.UI.Client/src/views/propertyeditors/listview/sortby.prevalues.controller.js#L14 - if the "includeProperties" pre-value does not exist.

Adding a null check to the look-up (i.e. _.findWhere(getPrevalues(), { key: "includeProperties" })?.value) fixes the JS error, but this only exposes the deeper root cause - namely that the pre-values are never set... neither editorState.current.preValues nor listViewPrevalueHelper.getPrevalues() returns any pre-values. So in order to fix this issue, one must figure out how to have either populated in an infinite editing state.

umbraco / Umbraco-CMS