Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
48 changes: 23 additions & 25 deletions documentation/docs/basics/kakao_compose_structure.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,9 @@ sidebar_position: 3

# Structure


### **Overview**

From version `1.0.0` Kakao Compose contains four main modules, with following dependencies
Starting with version `1.0.0`, Kakao Compose is organized into four primary modules, with the following dependency structure:

```mermaid
flowchart TD
Expand All @@ -30,49 +29,48 @@ flowchart TD
%% Style
style AEspresso color:#FFFFFF, fill:#AA00FF, stroke:#AA00FF
style ACompose color:#FFFFFF, fill:#AA00FF, stroke:#AA00FF

```

### **Core**
* `compose` - Core module, which providing DSL wrapping for Espresso methods, `ComposeScreen` page objects and `KNode` and list support. Version 1+ is mostly compatible with version 0+ and required minimum effort for migration.
* `compose` - The foundational module that provides a DSL wrapper for Espresso methods, `ComposeScreen` page objects, and support for `KNode` and lists. Version 1+ maintains broad compatibility with version 0+, requiring minimal effort to upgrade.

Can be added `implementation("io.github.kakaocup:compose:1.0.0")`
Add it with: `implementation("io.github.kakaocup:compose:1.0.0")`

### **Optional**

UI testing presents distinct approaches for XML and Compose implementations. A core concept in Compose is the use of Nodes, which are not type-based.
This introduces certain limitations in UI test development, such as the inability to perform type checks on views. The only way to retrieve states from a view is through `Semantic` providers.
In the Kakao Compose version, we identified an issue where developers attempted to add custom semantics to the core library, which detracted from its role as a "pure Espresso wrapper."
To address this, we opted for an extension libraries approach instead.

#### `compose-semantics`
Set of default semantics keys, what can be used by `compose-ui` and `compose-test` modules. This module is very lightweight and contains only set of semantics which used in `compose-test` to identify state of the view.
Need to be added explicitly only in case of having design system and avoiding direct dependency on `compose-ui`
UI testing differs significantly between XML and Compose approaches. A key aspect of Compose is its reliance on Nodes, which lack type specificity. This creates challenges in UI test creation, such as the inability to perform type-based checks on views. View states can only be accessed via `Semantic` providers. In earlier versions of Kakao Compose, developers often tried to embed custom semantics in the core library, which undermined its purpose as a simple Espresso wrapper. To resolve this, we shifted to an extension-based library model.

Can be added `implementation("io.github.kakaocup:compose-semantics:1.0.0")`
#### `compose-semantics`
A collection of default semantic keys utilized by the `compose-ui` and `compose-test` modules. This lightweight module includes only the semantics necessary for `compose-test` to determine view states. It should be added explicitly only if you’re using a design system and wish to avoid depending directly on `compose-ui`.

:::tip If you have a design system in your project
Add it with: `implementation("io.github.kakaocup:compose-semantics:1.0.0")`

You can add all required parameters to your design system based matching from [compose-ui](https://github.com/KakaoCup/Compose/tree/master/compose-ui/src/main/kotlin/io/github/kakaocup/compose/foundation) to avoid transitive dependency on Compose via Kakao
:::tip For projects with a design system

You can integrate all necessary parameters into your design system by referencing the mappings in [compose-ui](https://github.com/KakaoCup/Compose/tree/master/compose-ui/src/main/kotlin/io/github/kakaocup/compose/foundation), avoiding a transitive dependency on Compose through Kakao.

:::

#### `compose-ui`
Wrapped over Compose base components, with the same constructors declaration.
Those wrappers will set all possible semantics from `compose-semantics` module, which can be used by `compose-test` module. This module is for quick adding type based checks into your application
A wrapper around Compose’s foundational components, mirroring their constructor signatures. These wrappers apply all applicable semantics from the `compose-semantics` module, enabling the `compose-test` module to leverage them. This module simplifies adding type-specific checks to your app.

:::warning Compose transitive dependency
:::warning Transitive Compose dependency

By adding this module it will create non-directive dependency on project compose version. And your compose components can be out date, however we will try to release a new version in case of Compose version update.
Including this module introduces an indirect dependency on your project’s Compose version. This could lead to outdated components, though we aim to release updates aligned with new Compose versions.

:::

To avoid transitive dependency via Kakao Compose you may just copy source code of `compose-ui` into your project and add dependency just to `compose-semantics`
To bypass transitive dependencies via Kakao Compose, you can copy the `compose-ui` source code into your project and depend solely on `compose-semantics`.

Can be add `implementation("io.github.kakaocup:compose-ui:1.0.0")`
Add it with: `implementation("io.github.kakaocup:compose-ui:1.0.0")`

#### `compose-test`
Providing nodes for typed component validation such as `KButtonNode`, `KIconNode`, `KProgresBar` and etc.
Offers nodes for validating typed components, such as `KButtonNode`, `KIconNode`, `KProgressBar`, and more.

Add it with: `testImplementation("io.github.kakaocup:compose-test:1.0.0")`

Usage examples are available in the [Sample project](https://github.com/KakaoCup/Compose/tree/master/sample/src/androidTest/java/io/github/kakaocup/compose/test/node).

Can be added `testImplementation("io.github.kakaocup:compose-test:1.0.0")`
---

Examples of usage can be found in [Sample project](https://github.com/KakaoCup/Compose/tree/master/sample/src/androidTest/java/io/github/kakaocup/compose/test/node)
This version maintains the original meaning while improving clarity and flow. Let me know if you'd like further adjustments!