@capgo/capacitor-inappbrowser 8.7.2-beta.pr599.357.1 → 8.7.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -25,12 +25,10 @@ The official Capacitor Browser plugin has strict security limitations that preve
|
|
|
25
25
|
- **Camera and microphone access** within the browser context
|
|
26
26
|
- **URL change monitoring** for navigation tracking
|
|
27
27
|
- **Custom toolbars and UI** for branded experiences
|
|
28
|
-
- **
|
|
29
|
-
- **
|
|
30
|
-
- **Cookie, cache, and full browsing-data controls** for private or isolated sessions
|
|
31
|
-
- **Native proxy, download, and popup handling** for advanced embedded web apps
|
|
28
|
+
- **Cookie and cache management** for session control
|
|
29
|
+
- **Custom sizes** for extra control of the display position
|
|
32
30
|
|
|
33
|
-
Perfect for OAuth flows, embedded web apps,
|
|
31
|
+
Perfect for OAuth flows, embedded web apps, video calls, and any scenario requiring deep integration with web content.
|
|
34
32
|
|
|
35
33
|
## Documentation
|
|
36
34
|
|
|
@@ -76,82 +74,6 @@ import { InAppBrowser } from '@capgo/capacitor-inappbrowser';
|
|
|
76
74
|
InAppBrowser.open({ url: 'YOUR_URL' });
|
|
77
75
|
```
|
|
78
76
|
|
|
79
|
-
### Common use cases
|
|
80
|
-
|
|
81
|
-
#### Show Ionic UI over a live browser page
|
|
82
|
-
|
|
83
|
-
Use `toBack` when the native browser should stay visible behind your Ionic or Capacitor UI. This is useful for checkout overlays, payment confirmation panels, guided browser flows, or any flow where your app owns the controls while the web page remains loaded behind it.
|
|
84
|
-
|
|
85
|
-
```js
|
|
86
|
-
import { InAppBrowser } from '@capgo/capacitor-inappbrowser';
|
|
87
|
-
|
|
88
|
-
const { id } = await InAppBrowser.openWebView({
|
|
89
|
-
url: 'https://example.com/checkout',
|
|
90
|
-
toBack: true,
|
|
91
|
-
transparentBackground: true,
|
|
92
|
-
});
|
|
93
|
-
|
|
94
|
-
// If your overlay needs to interact with the page behind it, forward the gesture.
|
|
95
|
-
await InAppBrowser.dispatchInputEvent({
|
|
96
|
-
id,
|
|
97
|
-
type: 'click',
|
|
98
|
-
x: 160,
|
|
99
|
-
y: 420,
|
|
100
|
-
});
|
|
101
|
-
|
|
102
|
-
// Bring the browser back above the app when the native overlay is done.
|
|
103
|
-
await InAppBrowser.bringToFront({ id });
|
|
104
|
-
```
|
|
105
|
-
|
|
106
|
-
Make the app background transparent wherever the browser should be visible. `dispatchInputEvent()` supports click, touch, and scroll forwarding; coordinates are relative to the browser viewport.
|
|
107
|
-
|
|
108
|
-
#### Build a partial-screen browser or bottom sheet
|
|
109
|
-
|
|
110
|
-
Use `height`, `width`, `x`, and `y` for picture-in-picture views, browser sheets, or layouts where the user should keep interacting with the Ionic app around the browser. When the WebView does not cover the full screen, touches outside the browser frame pass through to the underlying Capacitor WebView on Android and iOS.
|
|
111
|
-
|
|
112
|
-
```js
|
|
113
|
-
const bottomGap = 200;
|
|
114
|
-
|
|
115
|
-
const { id } = await InAppBrowser.openWebView({
|
|
116
|
-
url: 'https://example.com/offers',
|
|
117
|
-
height: window.innerHeight - bottomGap,
|
|
118
|
-
y: 0,
|
|
119
|
-
});
|
|
120
|
-
```
|
|
121
|
-
|
|
122
|
-
Use `updateDimensions()` to resize the browser while keeping the same page state, for example when expanding a mini browser into a larger sheet.
|
|
123
|
-
|
|
124
|
-
#### Keep checkout, auth, or support sessions private
|
|
125
|
-
|
|
126
|
-
Use `persistWebViewData: false` when a WebView must avoid persistent cookies, cache, local storage, IndexedDB, and other website data where the platform supports it. Use `clearAllBrowsingData()` when the app needs to wipe the default store and all opened managed WebViews.
|
|
127
|
-
|
|
128
|
-
```js
|
|
129
|
-
const { id } = await InAppBrowser.openWebView({
|
|
130
|
-
url: 'https://example.com/login',
|
|
131
|
-
persistWebViewData: false,
|
|
132
|
-
});
|
|
133
|
-
|
|
134
|
-
// Later, after logout or account switching:
|
|
135
|
-
await InAppBrowser.clearAllBrowsingData();
|
|
136
|
-
```
|
|
137
|
-
|
|
138
|
-
#### Keep multiple browser instances ready
|
|
139
|
-
|
|
140
|
-
Use `hidden`, `hide()`, and `show()` when you need to preload or preserve several WebViews without keeping them on screen. This keeps browser state available while the native modal is dismissed so it does not block touches in the app.
|
|
141
|
-
|
|
142
|
-
```js
|
|
143
|
-
const first = await InAppBrowser.openWebView({ url: 'https://example.com/a', hidden: true });
|
|
144
|
-
const second = await InAppBrowser.openWebView({ url: 'https://example.com/b', hidden: true });
|
|
145
|
-
|
|
146
|
-
await InAppBrowser.show({ id: first.id });
|
|
147
|
-
await InAppBrowser.hide({ id: first.id });
|
|
148
|
-
await InAppBrowser.show({ id: second.id });
|
|
149
|
-
```
|
|
150
|
-
|
|
151
|
-
#### Embed advanced web app flows
|
|
152
|
-
|
|
153
|
-
Use proxy rules and `handleDownloads` for web apps that need request control, file uploads, downloads, or controlled popup behavior inside the managed browser. Typical examples include document portals, support desks, payment pages, Google Pay flows on Android, and apps that need to keep `_blank` links inside the same managed WebView.
|
|
154
|
-
|
|
155
77
|
### Customize Chrome Custom Tab Appearance (Android)
|
|
156
78
|
|
|
157
79
|
The `open()` method launches a Chrome Custom Tab on Android. You can customize its appearance to blend with your app:
|
|
@@ -98,7 +98,7 @@ public class CapgoInAppBrowserPlugin: CAPPlugin, CAPBridgedPlugin {
|
|
|
98
98
|
case aware = "AWARE"
|
|
99
99
|
case fakeVisible = "FAKE_VISIBLE"
|
|
100
100
|
}
|
|
101
|
-
private let pluginVersion: String = "8.7.
|
|
101
|
+
private let pluginVersion: String = "8.7.3"
|
|
102
102
|
public let identifier = "CapgoInAppBrowserPlugin"
|
|
103
103
|
public let jsName = "CapgoInAppBrowser"
|
|
104
104
|
public let pluginMethods: [CAPPluginMethod] = [
|
|
@@ -1382,7 +1382,6 @@ public class CapgoInAppBrowserPlugin: CAPPlugin, CAPBridgedPlugin {
|
|
|
1382
1382
|
containerView.backgroundColor = .clear
|
|
1383
1383
|
containerView.frame = UIScreen.main.bounds
|
|
1384
1384
|
containerView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
|
|
1385
|
-
containerView.passthroughView = self.bridge?.webView
|
|
1386
1385
|
|
|
1387
1386
|
let targetFrame = CustomWebViewFrameSupport.resolvedFrame(
|
|
1388
1387
|
width: width.map { CGFloat($0) },
|
|
@@ -3266,7 +3266,6 @@ class PassThroughView: UIView {
|
|
|
3266
3266
|
}
|
|
3267
3267
|
}
|
|
3268
3268
|
weak var framedContentView: UIView?
|
|
3269
|
-
weak var passthroughView: UIView?
|
|
3270
3269
|
|
|
3271
3270
|
override func layoutSubviews() {
|
|
3272
3271
|
super.layoutSubviews()
|
|
@@ -3279,14 +3278,14 @@ class PassThroughView: UIView {
|
|
|
3279
3278
|
}
|
|
3280
3279
|
|
|
3281
3280
|
override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
|
|
3281
|
+
// If we have a target frame and the touch is outside it, pass through
|
|
3282
|
+
if let frame = targetFrame {
|
|
3283
|
+
if !frame.contains(point) {
|
|
3284
|
+
return nil // Pass through to underlying views
|
|
3285
3285
|
}
|
|
3286
|
-
let convertedPoint = convert(point, to: passthroughView)
|
|
3287
|
-
return passthroughView.hitTest(convertedPoint, with: event)
|
|
3288
3286
|
}
|
|
3289
3287
|
|
|
3288
|
+
// Otherwise, handle normally
|
|
3290
3289
|
return super.hitTest(point, with: event)
|
|
3291
3290
|
}
|
|
3292
3291
|
}
|