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

Plnkr's are always broken here is a proposal to create a system of working plunkers #6734

Closed
xtianus79 opened this issue Aug 30, 2017 · 9 comments

Comments

@xtianus79
Copy link

xtianus79 commented Aug 30, 2017

Bug, feature request, or proposal:

Plnkr's to this point do not have a way to centralize a working version of the application in conjunction with the way an example from material 2 works.

The proposal is in 2 choices 1 being best and the 2nd being something that can be accomplished now.

  1. Plnkr could possibly have core components that are privately maintained and thus updated once to work across all examples. This would allowed for updated angular components and dependencies to be updated one time across the board. It would also allow for the individual feature / functionality to be adjusted on the material feature level... seperately.

  2. Since choice [Question]: will this be the official repo for Angular 2 Material? #1 is something not likely for the now. I will propose this to them as the utility would be mightly useful... There could be a running spec of working angular plunkr that could be referenced in the docs to allow you or us to easily adjust the examples to that working spec.

Documentation and instructions for this is important because otherwise there are nothing but just broken plunkrs for documentation

What is the expected behavior?

plnkr's work

What is the current behavior?

on updates they don't work

What are the steps to reproduce?

use a plnkr
Providing a Plunker (or similar) is the best way to get the team to see your issue.
Plunker template: https://goo.gl/DlHd6U

What is the use-case or motivation for changing an existing behavior?

wish they worked

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

4.3.6

Is there anything else we should know?

nope

@willshowell
Copy link
Contributor

I think this is a necessary headache during the packaging shakeup. After beta, breaking changes (especially packaging ones) will be far more rare.

However, I could see the autogenerated ones from the docs site pinning the version (akin to what angular core does with their issue template plunker).

@mLaird
Copy link

mLaird commented Aug 31, 2017

Additionally, code from the plnkrs throws errors when used. For example,
With systemjs.config.js set as
'@angular/cdk': 'npm:@angular/cdk/bundles/cdk.umd.js',
the app.module.ts statement
import {CdkTableModule} from '@angular/cdk';
creates the following error in Atom, even before code executes
angular-quickstart/node_modules/@angular/cdk/cdk has no exported member CdkTableModule

There is no file/directory called - @angular/cdk/cdk so something is generating an incorrect path for MD components.

There are other problems too numerous to mention (eg. 1. each package has to be in system.config.js, but no examples - I've tried several things and none work, and 2. lack of documentation with examples. I'm going back to beta.8 and hoping for future excellence in guiding users.

@gudh
Copy link

gudh commented Sep 1, 2017

@mLaird same problem here

Any solutions?

@benjamincharity
Copy link

FWIW, I'm using SystemJS for my tests and moving to beta.9 required me to explicitly map all the CDK libraries (where I used to only need a bundle for the cdk):

    // Before:
    '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
    '@angular/cdk': 'npm:@angular/cdk/bundles/cdk.umd.js',

    // After:
    '@angular/material': 'npm:@angular/material/bundles/material.umd.js',
    '@angular/cdk': 'npm:@angular/cdk/bundles/cdk.umd.js',
    '@angular/cdk/a11y': 'npm:/@angular/cdk/bundles/cdk-a11y.umd.js',
    '@angular/cdk/bidi': 'npm:/@angular/cdk/bundles/cdk-bidi.umd.js',
    '@angular/cdk/observers': 'npm:/@angular/cdk/bundles/cdk-observers.umd.js',
    '@angular/cdk/overlay': 'npm:/@angular/cdk/bundles/cdk-overlay.umd.js',
    '@angular/cdk/portal': 'npm:/@angular/cdk/bundles/cdk-portal.umd.js',
    '@angular/cdk/scrolling': 'npm:/@angular/cdk/bundles/cdk-scrolling.umd.js',
    '@angular/cdk/platform': 'npm:/@angular/cdk/bundles/cdk-platform.umd.js',
    '@angular/cdk/keycodes': 'npm:/@angular/cdk/bundles/cdk-keycodes.umd.js',
    '@angular/cdk/coercion': 'npm:/@angular/cdk/bundles/cdk-coercion.umd.js',
    '@angular/cdk/collections': 'npm:/@angular/cdk/bundles/cdk-collections.umd.js',
    '@angular/cdk/rxjs': 'npm:/@angular/cdk/bundles/cdk-rxjs.umd.js',
    '@angular/cdk/table': 'npm:/@angular/cdk/bundles/cdk-table.umd.js',

@jkosters
Copy link

jkosters commented Sep 5, 2017

Small adjustment, which made it work for me:

'@angular/material': 'https://unpkg.com/@angular/[email protected]/bundles/material.umd.js',
'@angular/cdk': 'https://unpkg.com/@angular/[email protected]/bundles/cdk.umd.js',
'@angular/cdk/a11y': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-a11y.umd.js',
'@angular/cdk/bidi': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-bidi.umd.js',
'@angular/cdk/observers': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-observers.umd.js',
'@angular/cdk/overlay': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-overlay.umd.js',
'@angular/cdk/portal': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-portal.umd.js',
'@angular/cdk/scrolling': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-scrolling.umd.js',
'@angular/cdk/platform': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-platform.umd.js',
'@angular/cdk/keycodes': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-keycodes.umd.js',
'@angular/cdk/coercion': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-coercion.umd.js',
'@angular/cdk/collections': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-collections.umd.js',
'@angular/cdk/rxjs': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-rxjs.umd.js',
'@angular/cdk/table': 'https://unpkg.com/@angular/[email protected]/bundles/cdk-table.umd.js',

@xtianus79
Copy link
Author

@jkosters We know the adjsutments work but the goal here is to try and find a more meaningful way for this not to consitently occur.

@mLaird
Copy link

mLaird commented Sep 12, 2017 via email

@josephperrott
Copy link
Member

The plunkers have been fixed in the latest release. We are also working on other ways to ensure it doesn't continue to happen

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 7, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants