René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"List View null ref on cell reuse","articleBody":"### Issue Description\n\nWhen adding multiple items to a list view at runtime, on iOS only, we get a crash:\r\n```\r\nNativescript encountered a fatal error: Uncaught TypeError: cannot read property 'removeFromSuperview' of null at _prepareCell(file: ...core/ui/list-view/index.ios.js\r\n```\r\n\r\nInvestigating further it was determined that the culprit is the code in `list-view/index.ios.ts::_prepareCell()`:\r\n\r\n```ts\r\n          this._removeContainer(cell);\r\n          (\u003cUIView\u003ecell.view.nativeViewProtected).removeFromSuperview();          \r\n```\r\n\r\nThe remove container method makes a call to\r\n\r\n```ts\r\n view.parent._removeView(view);\r\n```\r\nwhich sets the cell's `nativeViewProtected` to null as part of the parent's tear down, causing the removeFromSuperview() call to fail.\r\n\r\nThe easy workaround/fix is to make the remove call null safe eg \r\n\r\n```ts\r\n(\u003cUIView\u003e cell.view?.nativeViewProtected)?.removeFromSuperview()\r\n```\r\n\r\n\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nativescript-stackblitz-templates-xtpbxb?file=app/components/Home.svelte\r\n\r\nor inline\r\n\r\n```svelte\r\n\u003cpage\u003e\r\n        \u003cactionBar title=\"My Tasks\" /\u003e\r\n        \u003ctabView\u003e\r\n            \u003ctabViewItem title=\"To Do\"\u003e\r\n                \u003cgridLayout columns=\"*,120\" rows=\"70,*\"\u003e\r\n                    \u003c!-- Configures the text field and ensures that pressing Return on the keyboard\r\n                            produces the same result as tapping the button. --\u003e\r\n                    \u003ctextField col=\"0\" row=\"0\" bind:text=\"{textFieldValue}\" hint=\"Type new task...\" editable=\"true\"\r\n                            on:returnPress=\"{onButtonTap}\" /\u003e\r\n                    \u003cbutton col=\"1\" row=\"0\" text=\"Add task\" on:tap=\"{onButtonTap}\" /\u003e\r\n\r\n                    \u003clistView items=\"{todos}\" on:itemTap=\"{onItemTap}\" row=\"1\" colSpan=\"2\"\u003e\r\n                            \u003cTemplate let:item\u003e\r\n                                    \u003clabel text=\"{item.name}\" textWrap=\"true\" /\u003e\r\n                            \u003c/Template\u003e\r\n                    \u003c/listView\u003e\r\n                \u003c/gridLayout\u003e\r\n            \u003c/tabViewItem\u003e\r\n            \u003ctabViewItem title=\"Completed\"\u003e\r\n                    \u003clabel textWrap=\"true\"\u003eThis tab will list completed tasks for tracking.\u003c/label\u003e\r\n            \u003c/tabViewItem\u003e\r\n        \u003c/tabView\u003e\r\n\u003c/page\u003e\r\n\r\n\u003cscript\u003e\r\n\t\timport { Template } from 'svelte-native/components'\r\n\r\n\t\tlet todos = []\r\n\t\tlet textFieldValue = \"\"\r\n\r\n\t\tfunction onItemTap(args) {\r\n\t\t\t\tconsole.log(`Item ${todos[args.index].name} at index: ${args.index} was tapped`);\r\n\t\t}\r\n\r\n\t\tfunction onButtonTap() {\r\n\t\t\tif (textFieldValue === \"\") return; // Prevents users from entering an empty string.\r\n\t\t\tconsole.log(\"New task added: \" + textFieldValue + \".\"); // Logs the newly added task in the console for debugging.\r\n\t\t\ttodos = [{ name: textFieldValue }, ...todos] // Adds tasks in the ToDo array. Newly added tasks are immediately shown on the screen.\r\n\t\t\ttextFieldValue = \"\"; // Clears the text field so that users can start adding new tasks immediately.\r\n\t\t}\r\n\u003c/script\u003e\r\n```\r\n\r\nAdd a second/third item to the todolist and it should crash\n\n### Relevant log output (if applicable)\n\n_No response_\n\n### Environment\n\n(on another machine)\r\nNativescript Core 8.3.2\r\nPlatform iOS 13.4.1\n\n### Please accept these terms\n\n- [X] I have searched the [existing issues](https://github.com/NativeScript/NativeScript/issues) as well as [StackOverflow](https://stackoverflow.com/questions/tagged/nativescript) and this has not been posted before\n- [X] This is a bug report\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/NativeScript/NativeScript/blob/master/tools/notes/CONTRIBUTING.md#coc)","author":{"url":"https://github.com/halfnelson","@type":"Person","name":"halfnelson"},"datePublished":"2022-08-20T01:25:35.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":1},"url":"https://github.com/10000/NativeScript/issues/10000"}