ionic-native-mocks

by chrisgriffith

chrisgriffith / ionic-native-mocks

Ionic Native Mocks are designed to be used as placeholders during development for the actual Ionic N...

207 Stars 43 Forks Last release: over 2 years ago (2.0.10) 72 Commits 10 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

Ionic Native Mocks

Ionic Native Mocks are designed to be used as placeholders during development for the actual Ionic Native modules. Ionic Native is a curated set of wrappers for Apache Cordova plugins that make adding any native functionality you need to your Ionic mobile application easier.

Ionic Native wraps plugin callbacks in a Promise or Observable, providing a common interface for all plugins and making it easy to use plugins with Angular change detection.

However, once you integrate these plugins into your Ionic application, use of a device or emulator is required for development and testing which can slow your workflow.

Installation

This project allows developers to use Ionic Native Mocks in place of the actual Ionic Native modules. They can be installed in via to methods. 1) via npm: Installing these prebuilt mocks is easy but they are not easily customized. 2) via GitHub and manually added to your Ionic project: Installing this way means the mocks can be customized to return specific data, like a specific parsing of a QR code.

Installation via npm

Run following command to install a Ionic Native Mock into your project.

bash
npm install @ionic-native-mocks/[plug-in] --save

For instance, to install the camera mock:

bash
npm install @ionic-native-mocks/camera --save

You also need to install the Ionic Native package for each plugin you want to add. Please see the Ionic Native documentation for complete instructions on how to add and use the plugins.

Documentation

For the full Ionic Native documentation, please visit https://ionicframework.com/docs/native/.

Basic Usage

To use a plugin, import and add the plugin provider to your

@NgModule
, and then inject it where you wish to use it.
// app.module.ts
import { Camera } from '@ionic-native/camera';
import { CameraMock } from '@ionic-native-mocks/camera';
...

@NgModule({ ...

providers: [ ... { provide: Camera, useClass: CameraMock } ... ] ... }) export class AppModule { }

import { Platform } from 'ionic-angular';
import { Camera, CameraOptions } from '@ionic-native/camera';

@Component({ ... }) export class MyComponent {

constructor(private camera: Camera, private platform: Platform) {

platform.ready().then(() => {

  const options: CameraOptions = {
    quality: 100,
    destinationType: this.camera.DestinationType.DATA_URL,
    encodingType: this.camera.EncodingType.JPEG,
    mediaType: this.camera.MediaType.PICTURE
  }

  this.camera.getPicture(options).then((imageData) => {
    // imageData is either a base64 encoded string or a file URI
    // If it's base64:
    console.log(imageData);
    let base64Image = 'data:image/jpeg;base64,' + imageData;
  }, (err) => {
    // Handle error
  });
});

} }

Customization

To learn how to customize an Ionic Native Mock, see the guide at: https://chrisgriffith.wordpress.com/2017/08/21/customizing-ionic-native-mocks/ (https://chrisgriffith.wordpress.com/2017/08/21/customizing-ionic-native-mocks/)

Missing a mock? Found a problem?

Let us know or submit a PR!

Credits

Chris Griffith - @chrisgriffith

Leif Wells - @leifwells

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.