Fix #3010 Assigning None to exact or shape array properties causes exception

@plotly/dash-test-components/src/components/ArrayOfExactOrShapeWithNodePropAssignNone.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const ArrayOfExactOrShapeWithNodePropAssignNone = (props) => {
+    const { id, test_array_of_exact_prop, test_array_of_shape_prop } = props;
+
+    return (
+        <div id={id}>
+            {`length of test_array_of_exact_prop: ${(test_array_of_exact_prop || []).length}, length of test_array_of_shape_prop: ${(test_array_of_shape_prop || []).length}`}
+        </div>
+    );
+};
+
+ArrayOfExactOrShapeWithNodePropAssignNone.propTypes = {
+    id: PropTypes.string,
+    test_array_of_exact_prop: PropTypes.arrayOf(
+        PropTypes.exact({
+            label: PropTypes.node,
+            value: PropTypes.string
+        })
+    ),
+    test_array_of_shape_prop: PropTypes.arrayOf(
+        PropTypes.shape({
+            label: PropTypes.node,
+            value: PropTypes.string
+        })
+    )
+};
+
+export default ArrayOfExactOrShapeWithNodePropAssignNone;

@plotly/dash-test-components/src/index.js

@@ -12,6 +12,7 @@ import DrawCounter from './components/DrawCounter';
 import AddPropsComponent from "./components/AddPropsComponent";
 import ReceivePropsComponent from "./components/ReceivePropsComponent";
 import ShapeOrExactKeepOrderComponent from "./components/ShapeOrExactKeepOrderComponent";
+import ArrayOfExactOrShapeWithNodePropAssignNone from './components/ArrayOfExactOrShapeWithNodePropAssignNone';
 
 
 export {
@@ -27,5 +28,6 @@ export {
     DrawCounter,
     AddPropsComponent,
     ReceivePropsComponent,
-    ShapeOrExactKeepOrderComponent
+    ShapeOrExactKeepOrderComponent,
+    ArrayOfExactOrShapeWithNodePropAssignNone
 };

CHANGELOG.md

@@ -7,6 +7,7 @@ This project adheres to [Semantic Versioning](https://semver.org/).
 ## Fixed
 
 - [#2994](https://github.com/plotly/dash/pull/2994) Keep generated doc-string order for shape or exact props. Fixes [#2990](https://github.com/plotly/dash/issues/2990)
+- [#3011](https://github.com/plotly/dash/pull/3011) Fixed an exception error caused by assigning `None` to array properties with `exact` or `shape` element types. Fixes [#3010](https://github.com/plotly/dash/issues/3010)
 
 ## [2.18.1] - 2024-09-12
 

dash/dash-renderer/src/TreeContainer.js

@@ -322,7 +322,7 @@ class BaseTreeContainer extends Component {
                     });
 
                     node = rpath(frontPath, props);
-                    if (node === undefined || !node.length) {
+                    if (node === undefined || !node?.length) {
                         continue;
                     }
                     const firstNode = rpath(backPath, node[0]);

tests/integration/renderer/test_array_of_exact_or_shape_with_node_prop_assign_none.py

@@ -0,0 +1,31 @@
+from dash import Dash, html
+
+from dash_test_components import ArrayOfExactOrShapeWithNodePropAssignNone
+
+
+def test_aoeoswnpsn001_array_of_exact_or_shape_with_node_prop_assign_none(dash_duo):
+    app = Dash(__name__)
+    app.layout = html.Div(
+        [
+            ArrayOfExactOrShapeWithNodePropAssignNone(
+                id="test-component1",
+                test_array_of_exact_prop=[{"label": c, "value": c} for c in "abc"],
+                test_array_of_shape_prop=[{"label": c, "value": c} for c in "abc"],
+            ),
+            ArrayOfExactOrShapeWithNodePropAssignNone(
+                id="test-component2",
+                test_array_of_exact_prop=None,
+                test_array_of_shape_prop=None,
+            ),
+        ]
+    )
+
+    dash_duo.start_server(app)
+    dash_duo.wait_for_text_to_equal(
+        "#test-component1",
+        "length of test_array_of_exact_prop: 3, length of test_array_of_shape_prop: 3",
+    )
+    dash_duo.wait_for_text_to_equal(
+        "#test-component2",
+        "length of test_array_of_exact_prop: 0, length of test_array_of_shape_prop: 0",
+    )