Product Preview: Add WebKitViewController to handle authenticated sessions

[ealeksandrov]

Closes #7911, #7946.

Description

This PR adds WebKitViewController that uses access token for current user to authenticate them in the context of WKWebView.
Most of the code copied from WordPress-iOS.

Testing

Test on the device, as iOS Simulator has a bug around cookies management.

1. Switch to WP.com store.
2. Open products tab.
3. Start the flow to create new product ("+" button in navbar on product list)
4. Edit the title (or anything else) to have non-blank product.
5. Tap the "Preview" button appeared in navbar.
6. Confirm that webpage for draft product loads correctly.
7. Open user profile and tap "Log out". Close the webview.
8. Tap the "Preview" button in navbar again.
9. Confirm that webpage for draft product again loads correctly, authenticated for current user.

Video

RPReplay_Final1667395250.mp4

---

• I have considered if this change warrants user-facing release notes and have added them to RELEASE-NOTES.txt if necessary.

[wpmobilebot]

You can test the changes from this Pull Request by:

• Clicking here or scanning the QR code below to access App Center
• Then installing the build number pr7974-43e4dca on your iPhone

If you need access to App Center, please ask a maintainer to add you.

[peril-woocommerce]

	Warnings
⚠️	This PR is assigned to a milestone which is closing in less than 2 days Please, make sure to get it merged by then or assign it to a later expiring milestone
⚠️	PR has more than 500 lines of code changing. Consider splitting into smaller PRs if possible.

Generated by 🚫 dangerJS

[ealeksandrov]

While we don't need toolbar on the WebView yet (it's disabled by secureInteraction option), I decided to keep the (almost) full functionality. We can improve the preview feature by adding "device" button, already supported on WP-iOS with PreviewWebKitViewController subclass:

mobile	desktop

[rachelmcr]

I tested this on my WP.com test store but unfortunately the preview isn't working for me there. I'm getting redirected to the WP.com login screen:

Should this be working for all WP.com-hosted sites, including sites with custom domains? (The domain is the big difference I see with my test store.)

[ealeksandrov]

@rachelmcr can you try the flow on the device? I have the same issue with simulator, but never on the device. Sorry I forgot to mention it in the description.

For the reference, I've traced the issue to these lines:

woocommerce-ios/WooCommerce/Classes/Authentication/WebAuth/AuthenticationService.swift

Lines 188 to 189 in 5e67a0c

	let responseCookies = self.cookies(from: response, loginURL: url)
	let cookies = (session.configuration.httpCookieStorage?.cookies ?? [HTTPCookie]()) + responseCookies

On the device this code correctly combines response cookies from 2 requests.
On simulator it shows second request cookies in both objects:

• previous requests cookie storage: session.configuration.httpCookieStorage?.cookies (auth cookie is here)
• extraction of the cookies from the latest request: self.cookies(from: response, ...)

From the proxy log there is no difference in networking requests/responses.

[rachelmcr]

Aha, thanks! I ran into an odd issue on my device at first, where the Site.loginURL was an empty string and that resulted in the web view being blank:

(I lost track of the specific console error when that happened, but it was a problem with the web view trying to load the request ?redirect_to=https://teststore.rachel-test-domain.com/?post_type%3Dproduct%26p%3D3955%26preview%3Dtrue.)

But when I relaunched the app that seemed to correct itself, and now the previews are working consistently. Not sure if that's something worth digging into further, but thought I'd mention it.

I'll finish reviewing the code now!

[rachelmcr]

After I resolved the issues mentioned above, everything tested well here! 👍

Given the amount of code here that's the same between WPiOS and WCiOS, do you think it's worth refactoring it into a shared repo (maybe the WordPressUI pod)? (Not necessarily right now, but I'm thinking about future maintenance.)

[ealeksandrov]

odd issue on my device at first, where the Site.loginURL was an empty string

It happens when the old Site object is loaded from Core Data, where the loginURL is missing:

woocommerce-ios/Yosemite/Yosemite/Model/Storage/Site+ReadOnlyConvertible.swift

Line 36 in 47784c5

loginURL: loginURL ?? "",

Do you think hiding "preview" button for empty loginURL is reasonable? After minor migration period (1 app restart?) it will be filled in for everyone. Another approach is to force an API call to refresh the data, but I don't like that.

Given the amount of code here that's the same between WPiOS and WCiOS, do you think it's worth refactoring it into a shared repo (maybe the WordPressUI pod)? (Not necessarily right now, but I'm thinking about future maintenance.)

Agree! I considered moving this to WPAuthenticator library (also WP app comment), but it will require refactoring of both client apps and migration of additional dependencies. We can do it after we finish and validate this feature. Maybe we'll reuse it in other parts of the app and will have additional requirements by that time.

[rachelmcr]

Do you think hiding "preview" button for empty loginURL is reasonable? After minor migration period (1 app restart?) it will be filled in for everyone. Another approach is to force an API call to refresh the data, but I don't like that.

Agreed, I think just checking for an empty loginURL makes sense. Forcing a refresh seems like overkill, especially since it should be resolved fairly quickly.

I considered moving this to WPAuthenticator library (also WP app comment), but it will require refactoring of both client apps and migration of additional dependencies. We can do it after we finish and validate this feature.

Sounds good! I missed that WP comment before but it sums up the effort pretty well. :)

[ealeksandrov]

Added a check in af2e711 + unit test in 43e4dca.