Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem with ion-slides #227

Closed
rdiegoss opened this issue Feb 16, 2017 · 15 comments
Closed

Problem with ion-slides #227

rdiegoss opened this issue Feb 16, 2017 · 15 comments

Comments

@rdiegoss
Copy link

Adding in any HTML tag

  <ion-slide>
    <img src="url">
  </ion-slide>

  <ion-slide>
    <img src="url">
  </ion-slide>

  <ion-slide>
    <img src="url">
  </ion-slide>

</ion-slides>

and run "npm test"

Error:

LoginPage:
✖ Should be create Login Page
Chrome 56.0.2924 (Mac OS X 10.12.3)
Error: Error in ./homePage class homePage - inline template:62:6 caused by: Cannot read property 'removeAttribute' of undefined
TypeError: Cannot read property 'removeAttribute' of undefined
at cleanupStyles (webpack:////ionic-angular/components/slides/swiper/swiper.js:797:0 <- src/test.ts:28038:16)
at destroySwiper (webpack:///
/ionic-angular/components/slides/swiper/swiper.js:831:0 <- src/test.ts:28072:5)
at Slides.ngOnDestroy (webpack:////ionic-angular/components/slides/slides.js:914:0 <- src/test.ts:44412:101)
at Wrapper_Slides.ngOnDestroy (/IonicModule/Slides/wrapper.ngfactory.js:27:16)
at CompiledTemplate.proxyViewClass.View_homePage0.destroyInternal (/DynamicTestModule/homePage/component.ngfactory.js:501:21)
at CompiledTemplate.proxyViewClass.AppView.destroy (webpack:///
/@angular/core/src/linker/view.js:143:0 <- src/test.ts:82548:14)
at CompiledTemplate.proxyViewClass.DebugAppView.destroy (webpack:////@angular/core/src/linker/view.js:371:0 <- src/test.ts:82776:38)
at CompiledTemplate.proxyViewClass.View_homePage_Host0.destroyInternal (/DynamicTestModule/homePage/host.ngfactory.js:33:19)
at CompiledTemplate.proxyViewClass.AppView.destroy (webpack:///
/@angular/core/src/linker/view.js:143:0 <- src/test.ts:82548:14)
at CompiledTemplate.proxyViewClass.DebugAppView.destroy (webpack:///~/@angular/core/src/linker/view.js:371:0 <- src/test.ts:82776:38)

Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: 1.8.6
ios-sim version: 5.0.11
OS: macOS Sierra
Node Version: v6.9.0
Xcode version: Xcode 8.1 Build version 8B62

@lathonez
Copy link
Owner

lathonez commented Feb 16, 2017 via email

@lathonez
Copy link
Owner

Any luck?

@rdiegoss
Copy link
Author

rdiegoss commented Feb 23, 2017

Don't resolve :(

But, I'm just testing methods in my page and ignore slides in tag....

Thx

@lathonez
Copy link
Owner

The error is coming from here in swiper.js:

/*=========================
  Translate/transition helpers
  ===========================*/
// Cleanup dynamic styles
function cleanupStyles(s) {
    // Container
    removeClass(s.container, s._classNames);
    s.container.removeAttribute('style');

@lathonez
Copy link
Owner

Ahah, there's actually an earlier error:

Uncaught TypeError: this._plt.timeout is not a function

Which is because we don't mock timeout in platformmock

@lathonez
Copy link
Owner

Fixing the above is trivial, but afterwards it seems that initSlides (which creates slides.component) is not called.

@lathonez
Copy link
Owner

Spent ages trying to figure out why the slides weren't being initialised, but it goes back to the first error:

        this._plt.timeout(function () {
            _this._initSlides();
        }, 300);

If we mock out the timeout function to do nothing.. then nothing will happen

@lathonez
Copy link
Owner

We were missing five functions from PlatformMock necessary for the Slides to work. If you update your copy of PlatformMock you should find they will test fine now.

@rdiegoss
Copy link
Author

rdiegoss commented Feb 24, 2017

Thx, but this error continues....

HTML:

<div class="colgroup top-space">
    <ion-slides>

      <ion-slide>
        <img src""img>
      </ion-slide>

      <ion-slide>
        <img src""img>
      </ion-slide>

      <ion-slide>
        <img src""img>
      </ion-slide>

    </ion-slides>
  </div>

Plataform mock added 5 functions...

Error: Error in ./homePage class homePage - inline template:66:6 caused by: Cannot read property 'removeAttribute' of undefined
TypeError: Cannot read property 'removeAttribute' of undefined
at cleanupStyles (webpack:////ionic-angular/components/slides/swiper/swiper.js:797:0 <- src/test.ts:28898:16)
at destroySwiper (webpack:///
/ionic-angular/components/slides/swiper/swiper.js:831:0 <- src/test.ts:28932:5)
at Slides.ngOnDestroy (webpack:////ionic-angular/components/slides/slides.js:914:0 <- src/test.ts:45272:101)
at Wrapper_Slides.ngOnDestroy (/IonicModule/Slides/wrapper.ngfactory.js:27:16)
at CompiledTemplate.proxyViewClass.View_homePage0.destroyInternal (/DynamicTestModule/homePage/component.ngfactory.js:591:21)
at CompiledTemplate.proxyViewClass.AppView.destroy (webpack:///
/@angular/core/src/linker/view.js:143:0 <- src/test.ts:82767:14)
at CompiledTemplate.proxyViewClass.DebugAppView.destroy (webpack:///~/@angular/core/src/linker/view.js:371:0 <- src/test.ts:82995:38)

@lathonez
Copy link
Owner

lathonez commented Feb 24, 2017 via email

@recapix
Copy link

recapix commented Apr 4, 2017

Where namespace swipes are on ionic-angular ?

@recapix
Copy link

recapix commented Apr 4, 2017

I Tried make this Mock but I don´t know the Slides namespace

export class SwiperMock{ public initSwiper(): void {}; public startAutoplay(): boolean { return true;}; public stopAutoplay(): void {}; public pauseAutoplay(): void {}; public updateAutoHeight(): void {}; public updateContainerSize(): void {}; public updateSlidesSize(): void {}; public currentSlidesPerView(): number {return 1}; public update(): void {}; public fixLoop(): void {}; public slideTo(): boolean {return true}; public onTransitionStart(): void {}; public onTransitionEnd(): void {}; public slideNext(): any { return {}}; public slidePrev(): any { return {}}; public slideReset(): boolean {return true;}; public disableTouchControl(): boolean {return true;}; public enableTouchControl(): boolean {return true;}; public destroySwiper(): void {};

@lathonez
Copy link
Owner

lathonez commented Apr 4, 2017

@franciscotln
Copy link

I'm testing a page and facing the same problem 'Error during cleanup of component'. The problem is here components/slides/swiper/swipper.js:

function cleanupStyles (s) {
     s.container.removeAttribute('style');
    // Wrapper
    s._wrapper.removeAttribute('style');
}

this function is called inside another function destroySwiper() but the attributes container and _wrapper are missing so I get a TypeError by calling removeAttribute on undefined :-(

@lathonez
Copy link
Owner

Did you check out the linked issue?

ionic-team/ionic-unit-testing-example#22 (comment)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants