diff --git a/app/components/Viewer/Generic/Model/BlocksOptions.vue b/app/components/Viewer/Generic/Model/BlocksOptions.vue
index 465c7df0..a83c20a6 100644
--- a/app/components/Viewer/Generic/Model/BlocksOptions.vue
+++ b/app/components/Viewer/Generic/Model/BlocksOptions.vue
@@ -238,7 +238,7 @@ const polyhedronSchema = back_schemas.opengeodeweb_back.model_component_polyhedr
     <VisibilitySwitch data-testid="modelBlocksVisibilitySwitch" v-model="blocksVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="targetBlockIds[0]"
+      :componentIds="targetBlockIds"
       v-model:coloring_style_key="blocksActiveColoring"
       v-model:color="blocksColor"
       v-model:vertex_attribute_name="blocksVertexAttributeName"
@@ -259,7 +259,7 @@ const polyhedronSchema = back_schemas.opengeodeweb_back.model_component_polyhedr
     <VisibilitySwitch v-model="blockVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="blockId"
+      :componentIds="[blockId]"
       v-model:coloring_style_key="blockActiveColoring"
       v-model:color="blockColor"
       v-model:vertex_attribute_name="vertexAttributeName"
diff --git a/app/components/Viewer/Generic/Model/CornersOptions.vue b/app/components/Viewer/Generic/Model/CornersOptions.vue
index ff3edf43..287aaf44 100644
--- a/app/components/Viewer/Generic/Model/CornersOptions.vue
+++ b/app/components/Viewer/Generic/Model/CornersOptions.vue
@@ -159,7 +159,7 @@ const vertexSchema = back_schemas.opengeodeweb_back.model_component_vertex_attri
     <VisibilitySwitch data-testid="modelCornersVisibilitySwitch" v-model="cornersVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="targetCornerIds[0]"
+      :componentIds="targetCornerIds"
       v-model:coloring_style_key="cornersActiveColoring"
       v-model:color="cornersColor"
       v-model:vertex_attribute_name="cornersVertexAttributeName"
@@ -176,7 +176,7 @@ const vertexSchema = back_schemas.opengeodeweb_back.model_component_vertex_attri
     <VisibilitySwitch v-model="cornerVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="cornerId"
+      :componentIds="[cornerId]"
       v-model:coloring_style_key="cornerActiveColoring"
       v-model:color="cornerColor"
       v-model:vertex_attribute_name="vertexAttributeName"
diff --git a/app/components/Viewer/Generic/Model/LinesOptions.vue b/app/components/Viewer/Generic/Model/LinesOptions.vue
index d27e9d64..23f763bc 100644
--- a/app/components/Viewer/Generic/Model/LinesOptions.vue
+++ b/app/components/Viewer/Generic/Model/LinesOptions.vue
@@ -234,7 +234,7 @@ const edgeSchema = back_schemas.opengeodeweb_back.model_component_edge_attribute
     <VisibilitySwitch data-testid="modelLinesVisibilitySwitch" v-model="linesVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="targetLineIds[0]"
+      :componentIds="targetLineIds"
       v-model:coloring_style_key="linesActiveColoring"
       v-model:color="linesColor"
       v-model:vertex_attribute_name="linesVertexAttributeName"
@@ -255,7 +255,7 @@ const edgeSchema = back_schemas.opengeodeweb_back.model_component_edge_attribute
     <VisibilitySwitch v-model="lineVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="lineId"
+      :componentIds="[lineId]"
       v-model:coloring_style_key="lineActiveColoring"
       v-model:color="lineColor"
       v-model:vertex_attribute_name="vertexAttributeName"
diff --git a/app/components/Viewer/Generic/Model/SurfacesOptions.vue b/app/components/Viewer/Generic/Model/SurfacesOptions.vue
index 92a4c6e9..b0dbc791 100644
--- a/app/components/Viewer/Generic/Model/SurfacesOptions.vue
+++ b/app/components/Viewer/Generic/Model/SurfacesOptions.vue
@@ -242,7 +242,7 @@ const polygonSchema = back_schemas.opengeodeweb_back.model_component_polygon_att
     <VisibilitySwitch data-testid="modelSurfacesVisibilitySwitch" v-model="surfacesVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="targetSurfaceIds[0]"
+      :componentIds="targetSurfaceIds"
       v-model:coloring_style_key="surfacesActiveColoring"
       v-model:color="surfacesColor"
       v-model:vertex_attribute_name="surfacesVertexAttributeName"
@@ -263,7 +263,7 @@ const polygonSchema = back_schemas.opengeodeweb_back.model_component_polygon_att
     <VisibilitySwitch v-model="surfaceVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"
-      :componentId="surfaceId"
+      :componentIds="[surfaceId]"
       v-model:coloring_style_key="surfaceActiveColoring"
       v-model:color="surfaceColor"
       v-model:vertex_attribute_name="vertexAttributeName"
diff --git a/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue b/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
index 2c3608cb..31e4d24d 100644
--- a/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
+++ b/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
@@ -142,6 +142,7 @@ const { focusedIndex, handleKeyDown } = useTreeKeyboardNav(
     >
       <template #default="{ item, index }">
         <v-list-item
+          data-testid="treeRowWrapper"
           :class="[
             'tree-row-wrapper',
             {
diff --git a/app/components/Viewer/ObjectTree/Base/TreeRow.vue b/app/components/Viewer/ObjectTree/Base/TreeRow.vue
index f4a2dc70..042a04bc 100644
--- a/app/components/Viewer/ObjectTree/Base/TreeRow.vue
+++ b/app/components/Viewer/ObjectTree/Base/TreeRow.vue
@@ -48,6 +48,7 @@ function handleRowClick(event) {
     <div class="d-flex align-center flex-shrink-0">
       <v-icon
         v-if="!item.isLeaf"
+        :data-testid="item.isOpen ? 'collapseTreeRowButton' : 'expandTreeRowButton'"
         :icon="item.isOpen ? 'mdi-menu-down' : 'mdi-menu-right'"
         class="me-1"
         color="black"
@@ -69,6 +70,13 @@ function handleRowClick(event) {
         />
         <v-btn
           v-else-if="showEyeButton"
+          :data-testid="
+            getIndeterminate(item.raw)
+              ? 'indeterminateObjectEyeButton'
+              : isSelected(item.raw)
+                ? 'visibleObjectEyeButton'
+                : 'hiddenObjectEyeButton'
+          "
           :icon="
             getIndeterminate(item.raw)
               ? 'mdi-eye-minus-outline'
diff --git a/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue b/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue
index 3ec04bdd..ef702119 100644
--- a/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue
+++ b/app/components/Viewer/ObjectTree/Views/GlobalObjects.vue
@@ -182,6 +182,7 @@ function expandAll() {
         <template v-if="item.geode_object_type !== 'HorizonStack3D'">
           <v-btn
             v-if="item.viewer_type"
+            data-testid="focusObjectButton"
             icon="mdi-target"
             size="medium"
             variant="text"
@@ -190,6 +191,7 @@ function expandAll() {
           />
           <v-btn
             v-if="isModel(item)"
+            data-testid="expandModelComponentsButton"
             icon="mdi-magnify-expand"
             size="medium"
             class="ml-2"
@@ -206,6 +208,7 @@ function expandAll() {
           />
           <v-btn
             v-if="isModel(item) && hasCollectionsMap[item.id]"
+            data-testid="expandModelCollectionsButton"
             icon="mdi-format-list-group"
             size="medium"
             class="ml-2"
diff --git a/app/components/Viewer/Options/AttributeSelector.vue b/app/components/Viewer/Options/AttributeSelector.vue
index 8c695ceb..68490ee0 100644
--- a/app/components/Viewer/Options/AttributeSelector.vue
+++ b/app/components/Viewer/Options/AttributeSelector.vue
@@ -9,9 +9,9 @@ const attributeItem = defineModel("attributeItem", { type: Number });
 const attributeRange = defineModel("attributeRange", { type: Array });
 const attributeColorMap = defineModel("attributeColorMap", { type: String });
 
-const { id, componentId, schema } = defineProps({
+const { id, componentIds, schema } = defineProps({
   id: { type: String, required: true },
-  componentId: { type: String, default: undefined },
+  componentIds: { type: Array, default: undefined },
   schema: { type: Object, required: true },
 });
 
@@ -64,14 +64,21 @@ function resetRange() {
   }
 }
 
+function hasSelectedComponent(components) {
+  return Array.isArray(components) && components.length > 0;
+}
+
 function getAttributes() {
-  if (schema.properties.component_id && componentId === undefined) {
+  const requiresComponent = schema.properties.component_ids !== undefined;
+  if (requiresComponent && !hasSelectedComponent(componentIds)) {
     return;
   }
+
   const params = { id };
-  if (componentId !== undefined) {
-    params.component_id = componentId;
+  if (requiresComponent) {
+    params.component_ids = componentIds;
   }
+
   backStore.request(
     { schema, params },
     {
@@ -87,7 +94,7 @@ onMounted(() => {
 });
 
 watch(
-  () => [id, componentId, schema],
+  () => [id, componentIds, schema],
   () => {
     getAttributes();
   },
diff --git a/app/components/Viewer/Options/ColoringTypeSelector.vue b/app/components/Viewer/Options/ColoringTypeSelector.vue
index 212aeebf..0d15ef57 100644
--- a/app/components/Viewer/Options/ColoringTypeSelector.vue
+++ b/app/components/Viewer/Options/ColoringTypeSelector.vue
@@ -36,9 +36,9 @@ const polyhedron_attribute_color_map = defineModel("polyhedron_attribute_color_m
   type: String,
 });
 
-const { id, componentId, capabilities, schemas, allowRandom } = defineProps({
+const { id, componentIds, capabilities, schemas, allowRandom } = defineProps({
   id: { type: String, required: true },
-  componentId: { type: String, default: undefined },
+  componentIds: { type: Array, default: undefined },
   capabilities: {
     type: Object,
     default: () => ({}),
@@ -215,7 +215,7 @@ watch(
           v-model:attributeRange="vertex_attribute_range"
           v-model:attributeColorMap="vertex_attribute_color_map"
           :id="id"
-          :componentId="componentId"
+          :componentIds="componentIds"
           :schema="vertexSchema"
         />
       </template>
@@ -226,7 +226,7 @@ watch(
           v-model:attributeRange="edge_attribute_range"
           v-model:attributeColorMap="edge_attribute_color_map"
           :id="id"
-          :componentId="componentId"
+          :componentIds="componentIds"
           :schema="edgeSchema"
         />
       </template>
@@ -237,7 +237,7 @@ watch(
           v-model:attributeRange="cell_attribute_range"
           v-model:attributeColorMap="cell_attribute_color_map"
           :id="id"
-          :componentId="componentId"
+          :componentIds="componentIds"
           :schema="cellSchema"
         />
       </template>
@@ -248,7 +248,7 @@ watch(
           v-model:attributeRange="polygon_attribute_range"
           v-model:attributeColorMap="polygon_attribute_color_map"
           :id="id"
-          :componentId="componentId"
+          :componentIds="componentIds"
           :schema="polygonSchema"
         />
       </template>
@@ -259,7 +259,7 @@ watch(
           v-model:attributeRange="polyhedron_attribute_range"
           v-model:attributeColorMap="polyhedron_attribute_color_map"
           :id="id"
-          :componentId="componentId"
+          :componentIds="componentIds"
           :schema="polyhedronSchema"
         />
       </template>