Unusual actions observed in Ionic 3 app using webview 3 plugin

I am currently facing a significant problem with Webview 3. One of our developers upgraded it to webview 3 without utilizing the Ionic native webview plugin, and surprisingly, it is functioning well on our Ionic 3 application. As per the documentation available in this document, there have been breaking changes noted such as:

"Replace any usages of window.Ionic.normalizeURL() with window.Ionic.WebView.convertFileSrc()"

However, this modification was not implemented by the developer, but the functionality related to the camera is still operational. For example,

imageURI = normalizeURL(imageURI)
continues to work effectively on webview 3. Could you provide insights into why this behavior persists and what potential issues might arise for the application in the future?

Here are the relevant files:

package.json

{
    "name": "amr",
    "version": "3.0.1",
    "author": "Ionic Framework",
    ...

config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="mobile" version="4.5.32" versionCode="4.5.32" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
...
        <content src="index.html" />
    </widget>

Upon following the instructions provided in this documentation for an ionic 3 application, it resulted in displaying this error on the device instead. Is there an explanation for this discrepancy?

Git repository: https://github.com/Sampath-Lokuge/webview-3-with-ionic-3

angulartypescriptwebviewionic3cordova-plugins

Answer №1

normalizeURL invokes convertFileSrc internally and issues a warning indicating it is considered deprecated. This functionality may be removed in the upcoming major release, so you are secure for now, but not guaranteed in future releases.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Simulated custom error response object jasmine-Angular

Within the HTTP service, there is a single function designed to manage all HTTP errors, taking custom objects and displaying errors based on specific conditions. This is an example of the service function: get(path: string, params: HttpParams = new Http ...

angularunit-testingjasmine

Securely transfer data between objects using a for loop

Description I have two similar types that are not identical: type A = { a?: number b?: string c?: boolean } type B = { a?: number b?: string c?: string } I am looking to create an adapter function f() that can convert type A to type B, with ...

typescript

Is including takeUntil in every pipe really necessary?

I'm curious whether it's better to use takeUntil in each pipe or just once for the entire process? search = (text$: Observable<string>) => text$.pipe( debounceTime(200), distinctUntilChanged(), filter((term) => term.length >= ...

angulartypescriptrxjs

Changing elements transferred from component to service

Currently, I am in the process of refactoring my code by consolidating common component methods into a shared service. However, I have encountered an issue where I am unable to overwrite a component's public object property that is passed to the servi ...

angular

Issue with disabled button in Angular 2 when using Chrome's autocomplete feature

In a basic login form, the login button is initially disabled with the following code: [disabled]="!password || !loginName" When Chrome's autocomplete feature fills in the values for loginName and password, the button remains disabled after the pa ...

javascripthtmlangular

Upon being redirected to a different route, it immediately navigates back to the previous page

Whenever we redirect to a route using an anchor tag with [routerLink], or through the code using: router.navigate(['/path']) For example, if we redirect to the extractedData page from the result page, it initially shows the extractedData page b ...

angularangular-routerlink

Stream in Node.js seems to have frozen

I am looking to develop a basic csv parser using the csv module and effectively handle errors when the file is missing. If I remove the sleep functions, the code successfully reaches the Finally statement (and produces an error output). What am I overloo ...

node.jstypescriptcsvstream

Error message pops up in WebStorm when attempting to access the map object in Angular

Within one of the services in my Angular application, I have utilized the map() function to retrieve data from the GitHub API. getUser(username: string) { // Regular Expression used for String Manipulation return this.http.get('https://api.github.com ...

angulartypescriptwebstorm

Tips for integrating angular signature functionality using fabricjs in the latest version of Angular (Angular 11)

After struggling to make paperjs and the angular-signature library work together, I was at my wit's end. But then, I stumbled upon a different solution that proved to be much better. I realized that posting the solution under the appropriate question ...

javascriptangularfabricjsimplementationsignature

Angular allows for the addition of unique styles to a JSON

When I receive a JSON response from BE, it is displayed as is. However, I would like certain keys such as "type, includeDeactive, code etc..." to be in bold and the corresponding values to be italicized after the colons (:). Example: body: { ...

jsonangularparsingformatstyles

Ways to retrieve every item in an array

I'm experiencing difficulty accessing the array of each object. Please review the response structure below. { "status": "1", "status_text": "Success", "current_page": 1, "next_page": "0", "previous_page": "0", "to ...

arraysjsonangularionic2

Utilizing StyleFunctionProps within JavaScript for Chakra UI Enhancements

I need help figuring out how to implement StyleFunctionProps in my Chakra UI theme for my NextJS project. The documentation on Chakra's website provides an example in Typescript, but I am working with Javascript. Can someone guide me on adapting this ...

javascriptreactjstypescriptnext.jschakra-ui

The function in Angular 2 is invoked a total of four times

Take a look at this example. This example is derived from an Angular quick start sample, where the template invokes a function. import { Component } from '@angular/core'; @Component({ selector: 'my-app', template: `<h1>Hell ...

angular

Tips on preventing the initial undefined subscription in JavaScript when using RxJS

I am having trouble subscribing to an object that I receive from the server. The code initially returns nothing. Here is the subscription code: ngOnInit() { this.dataService.getEvents() .subscribe( (events) => { this.events = events; ...

javascriptangularrxjs

Should you approach TypeScript modules or classes with a focus on unit testing?

When it comes to unit testing in TypeScript, which content architecture strategy is more effective: Creating modules or classes? Module Example: moduleX.method1(); // Exported method Class Example: var x = moduleX.method1(); // Public method ...

javascripttypescript

What is the best way to access a private class variable within the sockent.on function in Angular?

export class AppComponent { title = 'my-app'; constructor(private notifyService : NotificationService) {} ngOnInit() { socket.on("laravel_database_chat:test", function(message){ //I AM ATTEMPTING TO INVOKE THE NOTIF ...

javascriptangulartypescriptsockets

Steps for converting TypeScript code to JavaScript using jQuery, without the need for extra libraries or frameworks like NPM

My single-page dashboard is quite basic, as it just displays weather updates and subway alerts. I usually refresh it on my local machine, and the structure looked like this: project/ index.html jquery-3.3.1.min.js script.js I decided to switch it t ...

javascriptjquerytypescripttsc

A declaration file in Typescript does not act as a module

Attempting to create a TypeScript declaration file for a given JavaScript library my_lib.js : function sum(a, b) { return a + b; } function difference(a, b) { return a - b; } module.exports = { sum: sum, difference: difference } my_lib.d.ts ...

javascripttypescript

Using custom Components to accept HTML input

I have recently developed a custom component to arrange content within IonCardContent. It has been effective for my current requirements: interface ContainerProps { position?: string; content?: string, colour?: string; custClass?: string; } ...

reactjstypescriptionic-frameworkionic-react

Tips for preventing the newly updated value from being linked to another array within Angular 13

Currently, I am using angular13 and working on a functionality where there is a button to move items from the left side to the right side. Interestingly, when an item is moved from the left to the right side and then edited under the right side, the edited ...

javascriptangular