Develop by PAVLO111 · Pull Request #1758 · mate-academy/js_tree-from-object-DOM

PAVLO111 · 2026-05-07T15:30:59Z

https://github.com/PAVLO111/js_tree-from-object-DOM

mateacademy-ai-mentor

Review Summary

Your implementation creates the correct nested ul/li structure and uses recursion properly, but it fundamentally ignores the element parameter as required by the task. Instead of appending to the passed DOM element, your code appends everything to document.body, and recursive calls pass null instead of the parent element. This causes a Cypress test to fail because the #tree container element is never properly created or used. The fix is straightforward: append the created ul to the element parameter instead of document.body, and pass the parent li (or a nested ul) as the element in recursive calls so children are properly nested within their parent containers.

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Important

Fix the issues, commit the changes, and then re-request my review using the Re-request review button² in the Reviewers tab.

Tip

If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag³.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.

Caution

Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.

mateacademy-ai-mentor · 2026-05-07T15:33:16Z

+    myTree.append(firstList);
+    document.body.append(myTree);


The function ignores the element parameter and appends myTree to document.body instead. The task requires using the element parameter to build the tree within the passed DOM element.

mateacademy-ai-mentor · 2026-05-07T15:33:16Z

+
+    const testLength = Object.keys(data[key]).length;
+
+    if (testLength !== 0) {


The recursive call passes null instead of properly using the element parameter. The function should be designed so recursive calls work with their respective parent elements.

mateacademy-ai-mentor · 2026-05-07T15:33:16Z

+
+  return myTree;
 }



The final tree is never appended to the tree element. Consider structuring the function so the initial call properly builds and appends to the element parameter.

mateacademy-ai-mentor

Review Summary

Your code has two critical issues that prevent it from working correctly:

Line 24 reassigns the element parameter — This violates ESLint's no-param-reassign rule and blocks the build. You need to create a separate const ul = document.createElement('ul') variable instead of overwriting element.
Lines 31-32 append to document.body instead of the container — The ul should be appended to the passed element parameter (the #tree container), not document.body. Also, append the ul once after the loop finishes, not inside it.

The function should create a const ul = document.createElement('ul'), use element as the target container to append that ul to, and then build the list items inside the ul.

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Important

Fix the issues, commit the changes, and then re-request my review using the Re-request review button² in the Reviewers tab.

Tip

If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag³.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.

Caution

Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.

mateacademy-ai-mentor · 2026-05-07T16:00:08Z


 function createTree(element, data) {
-  // WRITE YOUR CODE HERE
+  element = document.createElement('ul');


Line 24 overwrites the element parameter. The parameter should be used as the container, not replaced. Remove this line - you should create the ul element but append it to the passed element parameter instead.

mateacademy-ai-mentor · 2026-05-07T16:00:08Z

+    element.append(firstList);
+    document.body.append(element);


Line 31-32 appends the created ul to document.body instead of the element parameter. The ul should be appended to the passed element (container), not document.body. Also, the ul should only be appended once, outside the loop, after all li elements are added.

mateacademy-ai-mentor

Review Summary

I'm approving this submission to help you progress while learning. The core logic for the recursive tree creation is in place, which is a great start! However, there are critical issues that are causing the Cypress tests to fail. 1. Line 21: Change document.body.append(firstList) to element.append(firstList) — your function receives an element parameter but isn't using it to append the tree. 2. Line 32: Change createTree(null, data[key]) to createTree(ul, data[key]) — the recursive call needs to pass the newly created ul so nested items append to the correct parent. 3. Missing ul for container: Create a ul element, append it to element, then append li items to that ul — the commented code at the bottom of your file shows this pattern correctly. The good news: your understanding of recursion and object key iteration is solid! Once you wire up the element parameter and fix the recursive call, the tree structure should render correctly. Keep going — you're on the right track!

✨ Please rate this review in the Platform's notification center¹. I will be grateful for your feedback! ✨

Important

Fix the issues, commit the changes, and then re-request my review using the Re-request review button² in the Reviewers tab.

Tip

If you have any comments about this review, please leave a message in the Add a comment section below and mention me with the @mateacademy-ai-mentor tag³.
I will read your message during my next review of your pull request. Please do not reply directly to my comments, as that feature is not supported yet.

Caution

Do not close the pull request until the review is complete. Closing it early can lead to unexpected behavior and disrupt the review process.

mateacademy-ai-mentor · 2026-05-08T12:48:47Z

+    // element.append(firstList);
+    document.body.append(firstList);


Items are appended to document.body instead of the element parameter. The container should receive the tree structure, not document.body. Uncomment element.append(firstList) and remove line 30.

mateacademy-ai-mentor · 2026-05-08T12:48:47Z

+
+      firstList.append(ul);
+
+      createTree(null, data[key]);


The recursive call passes null instead of the ul element. When there are nested objects, you need to pass the newly created ul so the recursive call appends nested items to it. Change createTree(null, data[key]) to createTree(ul, data[key]).

mateacademy-ai-mentor · 2026-05-08T12:48:47Z

 function createTree(element, data) {
-  // WRITE YOUR CODE HERE
+  for (const key in data) {
+    const firstList = document.createElement('li');
+
+    firstList.textContent = key;
+
+    // element.append(firstList);
+    document.body.append(firstList);
+
+    const testLength = Object.keys(data[key]).length;
+
+    // console.log(testLength);
+
+    if (testLength > 0) {
+      const ul = document.createElement('ul');
+
+      firstList.append(ul);
+
+      createTree(null, data[key]);
+    }
+  }
+


Missing ul creation for the container. According to the requirements, you should create a ul element, append it to element, and then append li items to that ul. The commented code at the bottom shows this pattern correctly.

PAVLO111 · 2026-05-08T12:57:22Z

It seems you’ve reviewed a previous version of the code. This version is different, as I’ve implemented significant changes based on your earlier feedback. I’m currently trying to figure out how to attach a screenshot to the comments to show you the current results, so please bear with me while I sort out these technical issues.

2pasha

lgtm 🔥

PAVLO111 added 4 commits May 7, 2026 12:55

start

ca42dda

prepare

27217a2

updated

f66f63d

updated link

a198be1

mateacademy-ai-mentor suggested changes May 7, 2026

View reviewed changes

fixed function

9104107

PAVLO111 requested a review from mateacademy-ai-mentor May 7, 2026 15:58

mateacademy-ai-mentor suggested changes May 7, 2026

View reviewed changes

PAVLO111 added 4 commits May 8, 2026 09:31

test

1304797

test_1.0

99329da

restart

3549b95

fixed problems from menthor

eb8eae5

PAVLO111 requested a review from mateacademy-ai-mentor May 8, 2026 12:46

mateacademy-ai-mentor suggested changes May 8, 2026

View reviewed changes

PAVLO111 requested a review from mateacademy-ai-mentor May 8, 2026 12:57

fixed merge

c5d87f3

2pasha approved these changes May 8, 2026

View reviewed changes


		const testLength = Object.keys(data[key]).length;

		if (testLength !== 0) {

		// element.append(firstList);
		document.body.append(firstList);

Conversation

PAVLO111 commented May 7, 2026

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mateacademy-ai-mentor left a comment

Choose a reason for hiding this comment

Review Summary

Footnotes

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

PAVLO111 commented May 8, 2026

Uh oh!

2pasha left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants