sharepoint / pnp-js-core Goto Github PK
View Code? Open in Web Editor NEWCode moved to https://github.com/pnp/pnpjs. This repository is archived.
License: Other
Code moved to https://github.com/pnp/pnpjs. This repository is archived.
License: Other
Webpack 2 and Rollup (and probably every other packaging solution) support tree shaking.
Here is a very concise description and examples. Rollup
Webpack is adding tree shaking to v2, It is the next big thing in packaging.
I wanted to open up for discussion making this a requirement of all of our samples. Since this is about Patterns and Practices. I think tree shaking should be a best practice for SharePoint Framework development from the beginning.
Our API is perfect for it. If someone just uses the lists object and users object which is possible. It would shake off probably a good 90% of our library. However since we would make this part of our recommended best practice and offer super easy to use boilerplate's with it built in; We would be shaking off chunks of every library they installed into the boilerplate as well.
Mobile first! If our samples and boilerplate encourage this, we could have a significant impact on how well SP Framework apps run on mobile. Think 3G speeds.
@patrick-rodgers I just noticed on the rollup website one of the output module types they support is globals.
While we are on the subject, bundling is going to be a huge obstacle for people trying to learn this. We should start discussing ways to soften their landing into the world of gulp.
Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!
[X] Enhancement
[ ] Bug
[ ] Question
It's great to set options up front that are applied consistently, and many times it is perfect. But there are times, especially during development, where you want to pass specific values. For instance, odata=verbose in one call only. suggest you allow per call overrides to the .setup function.
I think this will become more and more important as the capabilities of the .setup function expand.
Happy to pick this up, logging in order to prevent duplication of effort
@patrick-rodgers - let me know if you're happy for me to proceed - you may not want the gulpfile.js altering?
If our requests get throttled, we need to retry, like the managed code pnp project does.
This is definitely a dumb one. When I follow the Quick Start Guide and run gulp serve, I get the following error:
module.js:341
throw err;
^Error: Cannot find module './settings.js'
at Function.Module._resolveFilename (module.js:339:15)
at Function.Module._load (module.js:290:25)
at Module.require (module.js:367:17)
at require (internal/module.js:16:19)
at Object. (D:\WebstormProjects\OfficeDev\PnP-JS-Core\gulpfile.js:26:16)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
at Module.load (module.js:357:32)
at Function.Module._load (module.js:314:12)
at Module.require (module.js:367:17)
Looks like I need to create a settings.js file, probably from settings.example.js. There's nothing in the Quick Start Guide that describes that step, and there probably should be.
We need to be able to execute CAML queries wen oob rest does not meet our needs. Add a method getCAML to the list object that takes a CAML Query. How Do II assign this to myself?
First I would like to see if everyone is aware of the design goal of project of making sure that consumption should be done by including the library and then being able to start using it directly through the pnp
object. I myself did not realise this was set in stone which led to some confusion in the discussions that followed.
Usage as shown in server-root/index.html
<script type="text/javascript">
require(['scripts/pnp'], function(pnp) {
alert("our random string: " + pnp.util.getRandomString(5));
});
</script>
This should be documented somewhere seeing as it's not going to be possible to change this signature after release.
The problem is that the transpilation gives us an object where the code is accessible through pnp.defaults
instead of pnp
directly as the transpilation adds some metadata to the object exposed. (The replace below shows what I mean)
The current approach around this is to rewrite the transpiled code by adding the following to the package.js build task (line 84 and 102)
.pipe(replace(/Object\.defineProperty\(exports, "__esModule", \{ value: true \}\);/ig, ""))
.pipe(replace(/exports.default = PnP;/ig, "return PnP;"))
I noticed that exposing the properties of the PnP class directly through export const sharepoint = new SharePoint();
would generate a pnp object that is consumable without rewriting the transpiled code with replace.
Exporting a class and using .replace() to rewrite the source
export default class PnP {
public static sharepoint = new SharePoint();
public static sp = new Rest();
}
Exporting constants without the use of a class in pnp.ts and with no .replace()
export const sharepoint = new SharePoint();
export const sp = new Rest();
The above 2 examples will both generate an object that we can do pnp.web.lists
on in the browser.
The class example will generate this code in /lib
export default class PnP {
}
/**
* Utility methods
*/
PnP.util = Util;
/**
* The full SharePoint library
*/
PnP.sharepoint = new SharePoint();
The const example will generate this code in /lib
export const sharepoint = new SharePoint();
export const sp = new Rest();
Related discussions that led to this issue can be found in #78 and #80.
Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!
[x] Enhancement
[ ] Bug
[ ] Question
If you are reporting an issue please describe the expected behavior. If you are suggesting an enhancement please
describe thoroughly the enhancement, how it can be achieved, and expected benefit. If you are asking a question, ask away!
If you are reporting an issue please describe the behavior you expected to occur when performing the action. If you are making a
suggestion or asking a question delete this section.
If you are reporting an issue please describe the steps to reproduce the bug in sufficient detail to allow testing. If you are making
a suggestion or asking a question delete this section.
Delete this section after reading
Thanks!
Code out the users, groups and roles REST API as outlined here.
Removing
src.push("!src/*.test.ts");
src.push("!src/**/*.test.ts");
from the build-typings task makes the tests actually compile again.
Should be fixed.
/**
* Inserts the string s into the string target as the index specified by index
*
* @param target The string into which we will insert s
* @param index The location in target to insert s (zero based)
* @param s The string to insert into target at position index
*/
export function stringInsert(target: string, index: number, s: string): string {
if (index > 0) {
return target.substring(0, index) + s + target.substring(index, target.length);
}
return s + target;
}
This reminds me of when the other PnP repo had the helper method to generate a SecureString. It was later removed due to not having the right "height".
/**
* Adds a value to a date
*
* @param date The date to which we will add units, done in local time
* @param interval The name of the interval to add, one of: ['year', 'quarter', 'month', 'week', 'day', 'hour', 'minute', 'second']
* @param units The amount to add to date of the given interval
*
* http://stackoverflow.com/questions/1197928/how-to-add-30-minutes-to-a-javascript-date-object
*/
export function dateAdd(date: Date, interval: string, units: number): Date {
let ret = new Date(date.toLocaleString()); // don't change original date
switch (interval.toLowerCase()) {
case "year": ret.setFullYear(ret.getFullYear() + units); break;
case "quarter": ret.setMonth(ret.getMonth() + 3 * units); break;
case "month": ret.setMonth(ret.getMonth() + units); break;
case "week": ret.setDate(ret.getDate() + 7 * units); break;
case "day": ret.setDate(ret.getDate() + units); break;
case "hour": ret.setTime(ret.getTime() + units * 3600000); break;
case "minute": ret.setTime(ret.getTime() + units * 60000); break;
case "second": ret.setTime(ret.getTime() + units * 1000); break;
default: ret = undefined; break;
}
return ret;
}
This is hard coded against an english locale. If a good library for handling dates is needed I would suggest handling it in in the application using the PnP library with something like moment.js vs us handling dates this way in the library itself.
I would argue that methods like this perhaps doesn't need to be in the actual pnp-js-core repo since all it's doing is providing a small abstraction for simple js. (Add to that list isFunction, stringIsNullOrEmpty)
Compare with
/**
* Loads a stylesheet into the current page
*
* @param path The url to the stylesheet
* @param avoidCache If true a value will be appended as a query string to avoid browser caching issues
*/
export function loadStylesheet(path: string, avoidCache: boolean): void {
if (avoidCache) {
path += "?" + encodeURIComponent((new Date()).getTime().toString());
}
let head = document.getElementsByTagName("head");
if (head.length > 1) {
let e = document.createElement("link");
head[0].appendChild(e);
e.setAttribute("type", "text/css");
e.setAttribute("rel", "stylesheet");
e.setAttribute("href", path);
}
}
This helps me as a dev by providing a single way of adding stylesheets. But should it be promoted to it's own class? DocumentStyleSheetInjector ?
(I'm also curios why getRandomString is not a test helper method)
Bug
Should be able to resolve and compile the TypeScript definitions without complaining about duplicates
There are multiple "Duplicate identifier XXX" errors after adding the TypeScript error. on changing few settings, at times it complains about the "Cannot find name XXX" as well.
Steps to reproduce the issue
Update:
This may wider that just Visual Studio 2015... maybe issue with generated TypeScript definition file itself? It was reported on 4/28/2016 that the modern style of including the pnp.d.ts into a file doesn't work? Need people to help figure this out, repro and also come up with a solution asap for all of us to review!
Has anyone attempted to use our TypeScript definition "pnp.d.ts" in a Visual Studio 2015 Professional/Enterprise (with Update 2) project yet (project type doesn't matter)?
I know right know we are targeting Visual Studio Code for at least contributions and also end user usage, however, for those of us that are used to Visual Studio 2015 Professional/Enterprise, it would be really cool to get the TypeScript definition pnp.d.ts to work there too!
The actual problem I'm experience is that I'm having major issues trying to get intellisense to work from another .ts file in the same project.
The usual:
/// <reference path="pnp.d.ts" />
references correctly (path is correct), but the $pnp object doesn't even exist from an intellisense point of view
Also I tried some of the "newer" ways to reference
imports {$pnp} from "pnp"
and while I get the $pnp object, it has no members in intellisense. Admittedly I am a super newbie to this style of referencing so I could have the syntax completely wrong or it shouldn't even be referenced this way.
I tried to keep things simple in that I have the pnp.d.ts file in the same directory as the test.ts file.
On another note, I successfully referenced the pnp.js file from another JavaScript file using the
/// <reference path="pnp.js" />
syntax and the $pnp object exists and has full members present.
So, from a TypeScript point of view and Visual Studio 2015 Professional/Enterprise (with Update 2) project:
Would love to see if someone can repro this issue as well.
Thanks!
Here is a list of documentation/sample topics that I feel would help if people visit our site they can use our library immediately (along with API documentation of course, which is being worked on here: #6).
Some or all of these maybe put in the wiki? Some may be in the sample project @patrick-rodgers demoed and/or both? A lot of these I envision screenshots as well as actual code.
note: need to figure out where site owners, who don't use editors like Visual Studio Code (because of company policies of installing software on the desktop), etc, can instead reference/download pnp.min.js from: a known CDN somewhere or somewhere in this repository (not link directly in that case, download first, then upload to a location of their choosing)?
Possible Tweaks to root readme.md
Appreciate more discussion/comments about what should be here...
As well as people taking these on asap as this library may start getting a lot of hits on 5/4/2016.
I'll take a start at updating the add/edit/delete methods as we discussed on the last call, as well as adding those methods to other classes such as item/view/etc.
Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!
[x ] Enhancement
[ ] Bug
[ ] Question
I was looking to see how I could convert an existing projext to use this library.
In one of my queries I have this:
var url = this.getHostApiUrl("Web/Lists/GetByTitle('" + listTitle + "')/getitems?$expand=ContentType,Folder,Folder/ParentFolder,File,File/ParentFolder,RoleAssignments,RoleAssignments/RoleDefinitionBindings,RoleAssignments/Member,RoleAssignments/Member/Users,RoleAssignments/Member/Groups,RoleAssignments/Member/UserId");
var caml = "" +
" " +
"" +
" " +
" " +
" " +
folderServerRelativeUrl +
" " +
" " +
" " +
" " +
" </View>";
var queryPayload = {
'query': {
'__metadata': { 'type': 'SP.CamlQuery' },
'ViewXml': caml
}
};
var folderLoaded = $q.defer();
I'm passing in a Caml query and also using $expand and $select.
The current inplementation of getItemsByCamlQuery, makes the call to sharepoint imeediately and returns the deferrerd. No chance to update it with $select or $expand (which I have working in my local repo).I We could make it so that We can use a Caml query and also be able to use $select and $expand.
I think I would want to do code something like this:
$pnp.sp.web.lists.getByTitle('Style Library').caml(q).select('Title').expand('RoleAssignments').get()
Hi,
I would like to add members to Field class in REST section and add tests to support it.
Should we implement a LocaleID enumeration, based on the table here?
It's used in quite a number of place and I for one am forever having to keep coming back to that table during my working hours.
Hi,
I'm trying to build the solution and I keep getting errors during linting process.
Declaration of private instance member variable not allowed to appear after declaration of public instance member function
.
few files only, but enough to ruin the build. Everything builds and test pass without linting.
Does anybody experience the same issue or it's just me?
Thanks in advance
https://msdn.microsoft.com/en-us/library/office/dn600183.aspx
Not going to add them all, but need ChangeQuery for get changes for lists. This will help with the building out of our types/interfaces as discussed on the last weekly call.
When we're building the Util.ts (general JavaScript helpers/utilities), we will probably start to reflect many of the functions that already exists in underscore.js (http://underscorejs.org/).
Is this a problem? Could it be an idea to depend on it? The production dist is very lightweight (approx 5kb).
Should the mock classes
MockConfigurationProvider
MockLocation
MockStorage
not be a part of the final compiled pnp.d.ts, pnp.js and pnp.min.js?
Reasons:
Maybe too long term, but just thinking about keeping the main library as small as possible so it performs as fast as possible for end users.
Any thoughts?
Expand the existing files and folders classes to support all methods as outlined here .
[ x ] Enhancement
[ ] Bug
[ x ] Question
/dist/pnp.js contains a very minimal copyright notice, and has the Microsoft (c) first
/**
* sp-pnp-js v1.0.1 - A reusable JavaScript library targeting SharePoint client-side development.
* Copyright (c) 2016 Microsoft
* MIT
*/
quote from: https://www.gnu.org/licenses/license-list.en.html
...the MIT license, [..] is misleading, since MIT has used many licenses for software.
if you only download pnp.js and never look at the correct LICENSE file in the root it is unclear what the license grants. That's why I reacted so harsh, I only looked at pnp.js
Since pnp.js will be distributed and shared as a single file, users might never browse to GitHub
General consensus is each file (distributed as separate file) should include the whole license:
references:
Create a developer dashboard based on the example from the first core library.
[x] Enhancement
spsave 2.x
is more solid and stable version of spsave
module. 2.x version rewritten from ground in TypeScript with unit and integration testing, performance improvements.
Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!
[ ] Enhancement
[x] Bug
[ ] Question
Compiling typescript using the pnp.d.ts definition file in npmjs.com/sp-pnp-js
Compile fails with the error: (3365,5): A 'declare' modifier cannot be used in an already ambient context.
Compile any typescript against this definition file.
I think we should extract the provisioning from the main "core library" seeing as it's around 25% of the total codebase right now.
My suggestion is that we move everything that is "core" into it's own folder and other "packages" into own folders.
For instance
/src/pnp - The core library
/src/provisioning - The provisioning framework, dependant on the core library
We would then package /src/pnp as pnp.js and /src/provisioning as provisioning.js.
Or: We remove provisioning and let it live as it's own repository that requires this library.
Bug
Display title of the current site.
SyntaxError: Unexpected token < in JSON at position 0 at ODataDefaultParser.ODataParserBase.parse
I am using the following code as I got from Wiki in a content editor web part on an on-premise version of SharePoint 2013.
$pnp.sp.web.select("Title").get() .then(function(data){ console.log(data.title); }) .catch(function(data){ console.log(data); });
I am getting the above error in the console when I run this. I've downloaded pnp.js and referred it in the HTML. I'm using Chrome. Any help?
Should we split the interfaces in types.ts to own files?
Usage of type is now import * as Types from "./types";
will have to become import { Type } from "./types/type.ts";
Would like to see us get the remaining jQuery refs out of ./src There aren't many and would remove a dependency for users.
Need to create decide on and create a clean build/package process for the "dist" folder. This will be used potentially by various packages so need to address minification and module design.
Code out the user profiles rest api based on the reference here.
[ ] Enhancement
[ X] Bug
[ ] Question
Stylesheet should be added to "head"
Stylesheed not added to "head"
call pnp.utils.loadStylesheet('path_to_my_stylesheet', false);
The issue seems to come from this test:
if (head.length > 1)
should be either head.length > 0 or >= 1
In working on the documentation generation, I noticed that in utils/logging.ts, there is a line near the top that is:
import Collections = require("../collections/Collections");
This one time occurrence is actually output in the pnp.d.ts TypeScript definition file.
Shouldn't that be changed instead to something like
import { Collections } from "../collections/Collections";
to use the es6 pattern that is used everywhere else in the codebase? That way code generation will go easier and perhaps reduce runtime dependency on requirejs (if that's what this is doing)?
In http://www.typescriptlang.org/docs/handbook/writing-definition-files.html says:
In general, you shouldn’t prefix interfaces with I (e.g. IColor). Because the concept of an interface in TypeScript is much more broad than in C# or Java, the IFoo naming convention is not broadly useful.
What stances does this repo take? Is there a styleguide being worked on to declare things like naming conventions, recommended patterns etc etc?
Thank you for reporting an issue, suggesting an enhancement, or asking a question. We appreciate your feedback - to help the team understand your
needs please complete the below template to ensure we have the details to help. Thanks!
[x ] Enhancement
[ ] Bug
[ ] Question
We should implement something to overcome/avert the 5000 item limit imposed by sharepoint. Maybe get batches of 5000 in sub-reqauest, but don't resolve the final promise until we have them all.
see http://sympmarc.com/2016/05/24/dear-microsoft-remove-the-5000-item-limit-for-sharepoint-list-views/
Patrick - Please assign me (alex-randall) this task as I am actively working on it and will have a pull request soon with it (1-2 days).
Background:
Gulpfile.js is starting to get large, but also anticipate much more growth in the future (such as for autogeneration of documentation).
Talked with Patrick about this offline.
I've already started work on breaking it apart and putting each task in a new "buildtasks" sub directory. I will prioritize this work as high priority (meaning pull request created in 1-2 days so that:
My idea is to keep a clean README.md in the root repo and reference the wiki from that readme.
Here is a start for documentation. Lots of cool possibilities here, can probably hang it off Web or Site (or both).
Disclaimer: This is just food for thought. I just rambled out some features "I" would love to use assuming infinite resources. A lot of these might be more appropriate to be a project built on top of this project or not at all.
_x0020_
.{ expandoAutoExpand: true }
In my opinion React, React Native, Redux/Flux, are going to continue to snowball and get even bigger. They make development easier. That is always a huge hit with developers.
<PeoplePicker scope=site ... />
. <---That looks sexy.Looking to automate the creation of documentation pages for the core API. We will still need to author samples and examples. Research using JSDoc or similar to convert code comments into markdown pages.
Create and document a bower distribution package. Need to work with core team as Microsoft needs to "own" the package
[X ] Enhancement
[ ] Bug
[ ] Question
Using webpack on OSX with Visual Studio Code, I am getting a lot of warning like:
WARNING in ./~/sp-pnp-js/lib/utils/Storage.js
There is another module with an equal name when case is ignored.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Rename module if multiple modules are expected or use equal casing if one module is expected.
WARNING in ./~/sp-pnp-js/lib/utils/storage.js
There is another module with an equal name when case is ignored.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Rename module if multiple modules are expected or use equal casing if one module is expected.
It seems it is due to import in "d.ts" files using sometimes lowercase and sometimes uppercase.
Thanks!
npm install is failing because of fsevents on Windows and Linux.
clone repo
npm install
Try on Windows/Linux
npm WARN notsup Not compatible with your operating system or architecture: [email protected]
I hope it will work on more OS if its ready.
Best regards!
Need to add $expand to Queryable object to allow nested objects. Also need #orderby,$sjip and $top (working on it)
Need to begin working on development of a PnP PowerShell script to provision a test site, upload our test files, and then instructions to execute them.
Idea would be that you can execute a PowerShell script to create a dev site with required files (pnp.js, pnp.tests.js ??) and then instructions to execute those tests. This would allow us to have lists, items, files etc we can test against in a controlled and known way. Welcome thoughts on this.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.