How to modify dependencies of child views in SwiftUI previews?

[chwo]

Hello!

I was wondering how a dependency can be modified in a SwiftUI preview so that the view and all of its child views use the modified dependency.

I ran into the issue that when modifying the dependency with the withDependencies function, the modified dependency is only available in the parent view but not in the child views.

See this minimal example:

enum ExampleKey: DependencyKey {
    static let testValue = "testValue"
    static let previewValue = "previewValue"
    static let liveValue = "liveValue"
}

extension DependencyValues {
    var exampleDependency: String {
        get { self[ExampleKey.self] }
        set { self[ExampleKey.self] = newValue }
    }
}

struct ParentView: View {
    var body: some View {
        ChildView()
    }
}

struct ChildView: View {
    @Dependency(\.exampleDependency) private var exampleDependency
    var body: some View {
        Text(exampleDependency)
    }
}

struct ParentView_Previews: PreviewProvider {
    static var previews: some View {
        withDependencies {
            $0.exampleDependency = "new value"
        } operation: {
            ParentView()
        }
    }
}

The preview does show the general "previewValue" text instead of the modified "new value" text.

It works when injecting the child view into the parent view, but this doesn't seem to be a practical option in general.

So I am wondering how to achieve this when using dependencies in child views? Or are they not intended to be used like this?

[tgrapperon]

Hey @chwo! @Dependency is not meant to be used in View, because we don't control the view's creation process, and we're not able to correctly propagate dependencies across the view tree.
One thing you can do however is to create an ObservedObject that hosts @Dependency properties, and share this model either directly, or using EnvironmentObject. Please note that if you store this model instance using StateObject, you may need a little more work to make sure that the dependencies are correctly captured. I'm explaining the problem and providing a workaround here.
It is otherwise fine to define dependencies overrides in previews, provided they're captured by the model and not by the view. I have a few examples of this in the CaseStudies demo of DependenciesAdditions.
If you want to propagate something across views, you should use Environment instead.

[chwo]

Thank you for the clarification 🙌

[mbrandonw]

NB: I was just about to hit send when @tgrapperon responded, but I'll still submit for posterity :)

Hi @chwo, we don't think @Dependency can really be used directly in SwiftUI views if you want to be able to change dependencies and have them propagate down the view hierarchy. If you use @Dependency in a view then the only features form the library that work will be that the testValue is used during tests and the previewValue is used during previews.

In order to get dependencies properly propagating through vanilla SwiftUI features, you need to use @Dependency in a proper ObservableObject, and you need to use withDependencies(from:) when constructing child ObservableObjects. We have lots of examples of this in our Standups demo app. Be sure to also read our Overriding dependencies documentation for more information.

[chwo]

Thank you for the clarification 🙌