prettier fix: multiple comments inside nested elements

Author: leonidaz

packages/prettier-plugin/src/index.test.js

@@ -1875,6 +1875,18 @@ message.push(/* Some test comment */ greet(/* Some text */ \`Ripple\`));`;
 		expect(result).toBeWithNewline(expected);
 	});
 
+	it('should not move commented composite elements to the outside of parent element', async () => {
+		const expected = `component Child({ children, NonExistent, ...props }) {
+  <div {...props}>
+    // <children />
+    // <NonExistent />
+  </div>
+}`;
+
+		const result = await format(expected, { singleQuote: true });
+		expect(result).toBeWithNewline(expected);
+	});
+
 	it('should keep comments inside function with one statement at the top', async () => {
 		const expected = `component App() {
   const something = 5;

packages/ripple/src/compiler/phases/1-parse/index.js

@@ -2115,9 +2115,12 @@ function get_comment_handlers(source, comments, index = 0) {
 						}
 						// Handle empty Element nodes the same way as empty BlockStatements
 						if (node.type === 'Element' && (!node.children || node.children.length === 0)) {
-							if (comments[0].start < node.end && comments[0].end < node.end) {
+							// Collect all comments that fall within this empty element
+							while (comments[0] && comments[0].start < node.end && comments[0].end < node.end) {
 								comment = /** @type {CommentWithLocation} */ (comments.shift());
 								(node.innerComments ||= []).push(comment);
+							}
+							if (node.innerComments && node.innerComments.length > 0) {
 								return;
 							}
 						}